AntDesign表单Form实例方法（useForm/ref）

[machao07]

1、获取表单实例

函数式组件

const AppletModal: React.FC<any> = (props) => {
    const [form] = Form.useForm();
    render(){
		return(
			<Form ref={form}></Form>
		)
	}
}

class类组件

import { FormInstance } from 'antd/lib/form';

class AppletEdit extends React.Component<any, any> {
    form: any = React.createRef();
    form = React.createRef<FormInstance>();
    render(){
		return(
			<Form ref={this.form}></Form>
		)
	}
}

2、form表单实例方法

给表单属性赋值 ref

函数式组件

form.setFieldsValue({
    bankIdList: options.map((v) => {
        return v.value;
    })
})

class组件

this.form.current.setFieldsValue({
    bankIdList: options.map((v) => {
        return v.value;
    })
})

3、打印 console.log(form)

1）获取所有表单属性值

返回一个json对象
this.form.current.getFieldsValue()

2) 设置表单属性值

this.form.current.setFieldsValue({ xxx: xxx })

更多

其他相关FormInstance说明及使用方法文档