我有一个React Component,QuizContainer,连接到Redux以获取其他一些状态数据。
该组件内部有一个名为“title”的组件。 我正在尝试为我的字段运行验证函数,但它似乎只输出一个空对象,并且仅在注册组件时。
这有什么问题吗?
更新:完整组件
class QuizContainer extends React.Component {
render() {
return (
<div className="contentpanel">
<div className="col-sm-6">
<form onSubmit={this.props.handleSubmit}>
<Field name="title" component={titleField} type="text" />
</form>
</div>
</div>
)
}
}
function mapStateToProps(state) {
return {
quiz: state.quiz,
mediaPanel: state.mediaPanel
}
}
function mapDispatchToProps(dispatch) {
return {
actions: bindActionCreators(quizActions, dispatch)
}
}
const titleField = ({input,
value,
label,
type,
meta: { touched, error, warning }}) => (
<div>
<input {...input} type={type} value={value}/>
{touched &&
((error && <span>{error}</span>) ||
(warning && <span>{warning}</span>))}
</div>
)
const validate = values => {
const errors = {};
if(values.title && values.title.length < 10){
errors.title = 'Title is missing';
}
return errors;
}
QuizContainer = connect(mapStateToProps, mapDispatchToProps)(QuizContainer);
export default reduxForm({
form: 'quiz',
validate
})(QuizContainer)