表單如果使用修飾器 getFieldDecorator
需要在自定義組件調(diào)用 this.props.onChange
表單如果使用 resetFields
需要在自定義組件中設(shè)置 value={this.props.value}
...
render() {
const { deptListOptions, onChange, value } = this.props;
return (
<TreeSelect
placeholder="請(qǐng)選擇"
style={{ width: '100%' }}
loadData={this.loadTreeNode}
dropdownStyle={{ maxHeight: 400, overflow: 'auto' }}
//實(shí)現(xiàn)外部的 resetFields 方法
value={value}
//實(shí)現(xiàn)外部的 getFieldDecorator 方法
onChange={onChange}
>
{this.renderTreeNodeOptions(deptListOptions)}
</TreeSelect>
);
}
...
自定義表單組件只要滿足以下條件讥蟆,即可與 Form 組件一起使用
提供受控屬性
value
或其它與valuePropName
的值同名的屬性。提供
onChange
事件或trigger
的值同名的事件歼疮。支持 ref:
參考:https://ant.design/components/form-cn/#components-form-demo-customized-form-controls