redux-form - 带有 FieldArray 组件的 asyncBlurFields
redux-form - asyncBlurFields with FieldArray Component
我想知道如何获取异步验证以在 FieldArray 内的 Field 组件上触发。我有类似的东西:
class MyForm extends Component {
constructor(props) {
super(props)
}
render() {
const { handleSubmit } = this.props
return (
<form onSubmit={handleSubmit}>
<Field
name="name"
type="text"
component={RenderInputField}
/>
<FieldArray
name="hobbies"
component={RenderHobbies}
/>
</form>
)
}
}
MyFormBase = reduxForm ({
form: 'MyForm',
validate,
asyncValidate,
asyncBlurFields: ['name', 'hobbies.hobby']
})(MyFormBase)
RenderHobbies 为:
const RenderHobbies = ({fields}) => (
<div>
{fields.map((hobby, index) => ({
<Field
name={`${hobby}.hobby`}
component={RenderInputField}
/>
}))}
</div>
)
export default RenderHobbies
这行不通。异步验证将在 "name" on blur 而不是 "hobbies.hobby" 时触发。正确的语法是什么?
我正在寻找的语法是:
asyncBlurFields: ['hobbies[].hobby']
很简单,只是我在文档中找不到它。我通过 this thread
找到了它
我想知道如何获取异步验证以在 FieldArray 内的 Field 组件上触发。我有类似的东西:
class MyForm extends Component {
constructor(props) {
super(props)
}
render() {
const { handleSubmit } = this.props
return (
<form onSubmit={handleSubmit}>
<Field
name="name"
type="text"
component={RenderInputField}
/>
<FieldArray
name="hobbies"
component={RenderHobbies}
/>
</form>
)
}
}
MyFormBase = reduxForm ({
form: 'MyForm',
validate,
asyncValidate,
asyncBlurFields: ['name', 'hobbies.hobby']
})(MyFormBase)
RenderHobbies 为:
const RenderHobbies = ({fields}) => (
<div>
{fields.map((hobby, index) => ({
<Field
name={`${hobby}.hobby`}
component={RenderInputField}
/>
}))}
</div>
)
export default RenderHobbies
这行不通。异步验证将在 "name" on blur 而不是 "hobbies.hobby" 时触发。正确的语法是什么?
我正在寻找的语法是:
asyncBlurFields: ['hobbies[].hobby']
很简单,只是我在文档中找不到它。我通过 this thread
找到了它