【React】React Hook “Form.useForm“ cannot be called in a class component. React Hooks must be called

应用场景

class声明的组件中使用resetFields来让表单重置，在这之前如果通过Form.useForm对表单数据域进行交互，报以下错误：

当我使用到函数组件时，我可以通过一下去定义state值，我们可以通过Form.useForm对表单数据域进行交互，如：setFieldsValue()、getFieldValue()、validateFields()、resetFields()等。

// [变量，操作方法] = React Hooks(值)
const [visible, setVisible] = React.useState(false);
const [confirmLoading,setConfirmLoading]=React.useState(false);
const [form] = Form.useForm();

然后快速设置值

setVisible(true);
setVisible(false);

解决

问题：==但是不可以在class声明的组件中去使用，useState，useForm是React Hooks的实现，只能用于函数组件。==如果我需要在class声明的组建中去使用该如何？

解决：在 Class 组件 下，需要通过 ref 获取数据域，通过ref获取的控制实例可使用API-FormInstance提供的所有方法，formRef = React.createRef();

import React, {
    
     Component } from 'react';
import {
    
     withRouter } from 'react-router-dom';
import {
    
     Form } from 'antd';
class LoginForm extends Component {
    
    
    formRef = React.createRef()
    changeCode = () => {
    
    
    	// 此处可用
        this.formRef.current.resetFields();
    }
    render() {
    
    
        return (
            <Form ref={
    
    this.formRef} ></Form>
        )
    }
}
export default withRouter(LoginForm);