import React, { useState } from 'react';
import { Form, Input, Button } from 'antd';

class DecimalCompareForm extends React.Component {
formRef = React.createRef();

handleSubmit = () => {

this.formRef.current?.validateFields()
  .then(values => console.log('提交成功:', values))
  .catch(error => console.error('校验失败:', error));

};

render() {

return (
  <Form ref={this.formRef}>
    <Form.Item
      label="数值 A"
      name="valueA"
      rules={[
        { required: true, message: '必填' },
        { pattern: /^\d+(\.\d+)?$/, message: '必须为数字' },
        ({ getFieldValue }) => ({
          validator(_, value) {
            const valueB = getFieldValue('valueB');
            if (value && valueB && parseFloat(value) > parseFloat(valueB)) {
              return Promise.reject('A 不能大于 B');
            }
            return Promise.resolve();
          },
        }),
      ]}
    >
      <Input 
        placeholder="请输入数值 A" 
        onChange={() => {
          // 修改B输入框后,同步触发A的验证
          this.formRef.current?.validateFields(['valueA']);
          this.formRef.current?.validateFields(['valueB']);
        }}
      />
    </Form.Item>

    <Form.Item
      label="数值 B"
      name="valueB"
      rules={[
        { required: true, message: '必填' },
        { pattern: /^\d+(\.\d+)?$/, message: '必须为数字' },
        ({ getFieldValue }) => ({
          validator(_, value) {
            const valueA = getFieldValue('valueA');
            if (value && valueA && parseFloat(value) < parseFloat(valueA)) {
              return Promise.reject('B 不能小于 A');
            }
            return Promise.resolve();
          },
        }),
      ]}
    >
      <Input 
        placeholder="请输入数值 B" 
        onChange={() => {
          // 修改B输入框后,同步触发A的验证
          this.formRef.current?.validateFields(['valueA']);
          this.formRef.current?.validateFields(['valueB']);
        }}
      />
    </Form.Item>

    <Button type="primary" onClick={this.handleSubmit}>
      提交
    </Button>
  </Form>
);

}
}

export default DecimalCompareForm;


大煜哈
1 声望0 粉丝