antd之Input的onChange坑

    首先说一下需求，三个input框的值输入数字，想让其自动加减，然后复制给第四个输入框

很简单的一个例子，原本想用onChange结合getFieldValue来使用呢    却发现此onChange非彼onChange的

html代码

<Row type={'flex'} style={{  '100%' }} align="middle">
          <Col span={17}>
            <FormItem label="一号"
              style={{ display: 'flex' }}
              {...formItemLayout}
              required={true}
            >
              {form.getFieldDecorator('one', config)(
                <Input placeholder="one" onChange={onChange} />
              )}
            </FormItem>
          </Col>
        </Row>
        <Row type={'flex'} style={{  '100%' }} align="middle">
          <Col span={17}>
            <FormItem label="二号"
              style={{ display: 'flex' }}
              {...formItemLayout}
              required={true}
            >
              {form.getFieldDecorator('two', config)(
                <Input placeholder="two" onChange={onChange}/>
              )}
            </FormItem>
          </Col>
        </Row>
        <Row type={'flex'} style={{  '100%' }} align="middle">
          <Col span={17}>
            <FormItem label="三号"
              style={{ display: 'flex' }}
              {...formItemLayout}
              required={true}
            >
              {form.getFieldDecorator('three', config)(
                <InputNumber placeholder="three" onChange={onChange} />
              )}
            </FormItem>
          </Col>
        </Row>
        <Row type={'flex'} style={{  '100%' }} align="middle">
          <Col span={17}>
            <FormItem label="总数"
              style={{ display: 'flex' }}
              {...formItemLayout}
              required={true}
            >
              {form.getFieldDecorator('sum', config)(
                <Input placeholder="sum" />
              )}
            </FormItem>
          </Col>
        </Row>

js

const onChange=(e)=>{
    const one=form.getFieldValue("one")
    const two = form.getFieldValue("two")
    const three = form.getFieldValue("three")
    console.log(one,two,three,"one two three");
  }


//此时你就会发现不能实时的更新  原因是当你动态的改变了值dom结构并没有实时更新过来，所以只有你第二次触发此函数的时候才会达到上一次的值

//那么你非要这样获取怎么办呢    两种思路可以获取到

//一是   将你的打印简单粗暴的放在一个定时器中就可以获取去
//二是  将这个函数封装成一个异步函数也可以获取到


//由此可见这样都比较不好   所以antd给你提供了e   目的就是想让你当前输入用e.target.value来获取 而不是用getFieldValue获取当前输入值

//因此可见from的onSubmit就是一个异步方法可以将你输入的所有值获取到