带有动态字段 id 的 redux 表单验证答案

【问题标题】：redux form validation with dynamic field id带有动态字段 id 的 redux 表单验证
【发布时间】：2018-09-08 02:02:27
【问题描述】：

当表单字段是动态的时，我被卡住了如何进行验证，就像我希望在每个字段上都需要和电子邮件验证，但是获得像 {0-name:'',0-email:''} 等字段。 ..那么如何验证？我需要为每个字段添加验证吗？

class Dash extends Component {
ListData = () => {
    let a = [];
    for (var i = 0; i < 5; i++) {
        a.push(<ListItemView value={i} key={i} />);
    }
    return a;
};
render() {
    return (
        <div className="col-lg-12 col-sm-12 col-12 r-p0">
            <CardContent className="pb-3 r-p0" elevation={4}>
                    <form onSubmit={this.props.handleClick}>
                        <List>{this.ListData()}</List>
                    </form>
                </CardBox>
            </CardContent>
        </div>
    );
}
}

const ListItemView = ({ value }) => {
return (
    <ListItem className="invitememberlist">
        {console.log(value, 'key')}
        <div className="col-12 w-100">
            <div className="row">
                <div className="col-lg-4 col-sm-5 col-12">
                    <Field
                        name={`${value}-name`}
                        component={renderTextField}
                        label="Name"
                        className="mt-1"
                        fullWidth
                        margin="normal"
                    />
                </div>
                <div className="col-lg-5 col-sm-5 col-12">
                    <Field
                        name={`${value}-email`}
                        component={renderTextField}
                        label="Email"
                        className="mt-1"
                        fullWidth
                        margin="normal"
                        type="email"
                    />
                </div>
            </div>
        </div>
    </ListItem>
);
};

验证.js

 export const isvalidinvitemember = (values) => {
   const errors = {};

     console.log(values);

return errors;
};

【问题讨论】：

标签： reactjs redux react-redux redux-form redux-thunk

【解决方案1】：

Redux Form 有一个 validate 属性，如果你想验证每个字段，你可以使用这个属性。

例如：

<Field
 name="username"
 type="text"
 component={renderField}
 label="Username"
 validate={required}
/>

参考here

【讨论】：