提交 904fd0a3 编写于 作者: M muzea 提交者: 偏右

form add how to get wrappedComponent's ref

上级 68a110af
......@@ -57,6 +57,23 @@ The following `options` are available:
| validateMessages | Default validate message. And its format is similar with [newMessages](https://github.com/yiminghe/async-validator/blob/master/src/messages.js)'s returned value | Object { [nested.path]: String } |
| onFieldsChange | Specify a function that will be called when the value a `Form.Item` gets changed. Usage example: saving the field's value to Redux store. | Function(props, fields) |
| onValuesChange | A handler while value of any field is changed | (props, changedValues, allValues) => void |
| withRef | Whether `refs` contain `wrappedComponent` | boolean |
If you want to get `ref` after `Form.create`, you can use `withRef` or `wrappedComponentRef` provided by `rc-form`[details can be viewed here](https://github.com/react-component/form#note-use-wrappedcomponentref-instead-of-withref-after-rc-form140)
```jsx
class CustomizedForm extends React.Component { ... }
// use withRef
const EnhancedForm = Form.create({ withRef: true })(CustomizedForm);
<EnhancedForm ref={(form) => this.form = form} />
this.form.refs.wrappedComponent // => The instance of CustomizedForm
// use wrappedComponentRef
const EnhancedForm = Form.create()(CustomizedForm);
<EnhancedForm wrappedComponentRef={(form) => this.form = form} />
this.form // => The instance of CustomizedForm
```
If the form has been decorated by `Form.create` then it has `this.props.form` property. `this.props.form` provides some APIs as follows:
......
......@@ -59,6 +59,23 @@ CustomizedForm = Form.create({})(CustomizedForm);
| validateMessages | 默认校验信息,可用于把默认错误信息改为中文等,格式与 [newMessages](https://github.com/yiminghe/async-validator/blob/master/src/messages.js) 返回值一致 | Object { [nested.path]&#x3A; String } |
| onFieldsChange | 当 `Form.Item` 子节点的值发生改变时触发,可以把对应的值转存到 Redux store | Function(props, fields) |
| onValuesChange | 任一表单域的值发生改变时的回调 | (props, changedValues, allValues) => void |
| withRef | `refs` 中是否有 `wrappedComponent` | boolean |
经过 `Form.create` 之后如果要拿到 `ref`,可以使用 `withRef` 也可以使用 `rc-form` 提供的 `wrappedComponentRef`[详细内容可以查看这里](https://github.com/react-component/form#note-use-wrappedcomponentref-instead-of-withref-after-rc-form140)
```jsx
class CustomizedForm extends React.Component { ... }
// use withRef
const EnhancedForm = Form.create({ withRef: true })(CustomizedForm);
<EnhancedForm ref={(form) => this.form = form} />
this.form.refs.wrappedComponent // => The instance of CustomizedForm
// use wrappedComponentRef
const EnhancedForm = Form.create()(CustomizedForm);
<EnhancedForm wrappedComponentRef={(form) => this.form = form} />
this.form // => The instance of CustomizedForm
```
经过 `Form.create` 包装的组件将会自带 `this.props.form` 属性,`this.props.form` 提供的 API 如下:
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册