从5.3.1更改为6.0.0:
>从render()中删除了字段:
const {handleSubmit,fields:{email,password,passwordConfirm}} = this.props;
>从输入中删除错误验证:
{email.touched&& email.error&& < div className =“error”> {email.error}< / div>}
>从导出默认值中删除字段数组:
export default reduxForm({
形式:’注册’,
字段:[’email’,’password’,’passwordConfirm’],
验证
},mapStateToProps,actions)(注册);
>为Material-UI组件添加了包装器:
从’../material-ui-wrapper’导入{renderTextField,renderCheckbox,renderSelectField,renderDatePicker};
码:
1 – console.log(this.props)不记录任何动作创建者 – 应该记录signupUser函数
'use strict'; import React,{ Component } from 'react'; import { reduxForm,Field } from 'redux-form'; import * as actions from '../../actions'; import { renderTextField } from '../material-ui-wrapper'; import {Card,CardActions,CardHeader,CardText} from 'material-ui/Card'; import FlatButton from 'material-ui/FlatButton'; class Signup extends Component { handleFormSubmit(formProps) { console.log(this.props); this.props.signupUser(formProps); } renderAlert() { if (this.props.errorMessage) { return ( <div className="error"> {this.props.errorMessage} </div> ); } } render() { const { handleSubmit,pristine,submitting } = this.props; return ( <form id="form" onSubmit={handleSubmit(this.handleFormSubmit.bind(this))}> <Card> <CardHeader title="Cadastre-se"/> <CardText> <Field name="email" component={renderTextField} label={"Email"} fieldType="text"/> <Field name="password" component={renderTextField} label={"Senha"} fieldType="password"/> <Field name="passwordConfirm" component={renderTextField} label={"Confirmação de senha"} fieldType="password"/> {this.renderAlert()} </CardText> <CardActions> <FlatButton type="submit" label="Criar!"/> </CardActions> </Card> </form> ); } } function validate(formProps) { const errors = {}; if (!formProps.email || !/^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,4}$/i.test(formProps.email)) { errors.email = 'Por favor,informe um email válido'; } if (formProps.password !== formProps.passwordConfirm) { errors.password = 'Senhas devem ser iguais.'; } if (!formProps.password) { errors.password = 'Por favor,informe uma senha.'; } if (!formProps.passwordConfirm) { errors.passwordConfirm = 'Por favor,confirme a sua senha.'; } return errors; } function mapStateToProps(state) { return { errorMessage: state.auth.error }; } export default reduxForm({ form: 'signup',validate },actions)(Signup);
编辑
更改:
export default reduxForm({
形式:’注册’,actions)(注册);
至:
注册= reduxForm({
形式:’注册’,
验证
})(注册);
export default Signup = connect(mapStateToProps,actions)(注册);
有效.这是解决这个问题最正确的方法吗?
export default reduxForm({ form: 'signup',actions)(Signup);
使用:
Signup = reduxForm({ form: 'signup',validate})(Signup); export default Signup = connect(mapStateToProps,actions)(Signup);
PS:可能是一个解决方案
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。