记录学习React-antd 4x版本 Form表单的提交和重置功能

记录学习React-antd 4x版本 Form表单的提交和重置功能

• 提交功能

class FilterFrom extends React.Component {
  baseFrom = React.createRef()
  
 点击事件 
onCheck = async () => {
    try {
      const values = await this.baseFrom.current.validateFields();
      console.log('Success:', values);
      message.success('提交校验成功')
    } catch (errorInfo) {
      console.log('Failed:', errorInfo);
      message.warn('提交校验失败')
    }
  };
 render(){
 return(
   <Form ref={this.baseFrom} layout="inline" name="baseForm">
  <Button type="primary" htmlType="submit" onClick={this.onCheck} style={{ margin: '0 20px' }}>查询</Button>
   <Button htmlType="button" >重置</Button>
  </Form>
 )}
  }
  特殊情况: 例如modal框点击会返回 Promise {<pending>} 需要解析 promise 
  要用 then接收
  或者
  async await解析

   let cityInfo = this.userForm.current.validateFields();
   cityInfo.then((res) => { console.log(res) });  //我是用的这个方法

• 重置功能

之前的this.props.form.resetFields() 已经不实用了，
虽然我知道有办法可以弄，
但是我找了很久也没有找到，所以放弃了，
（拒绝直接把查询的值参数变为0！！！！）
接下来是4x常用的方法