无法以缩略形式显示提交错误

Question

我试图在我的表单中显示提交错误，但我找不出为什么这不起作用。当我尝试提交表单时出现错误，我只是在控制台中出现简单错误，无法再次提交，尽管启用了这些按钮，并且没有错误显示在我的表单中。

未捕获的（以诺）

const validate = values => { 
    const errors = {} 
    const requiredFields = [ 'email', 'password' ] 
    requiredFields.forEach(field => { 
     if (!values[ field ]) { 
      errors[ field ] = 'Pole wymagane' 
     } 
    }) 
    if (values.email && !/^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,4}$/i.test(values.email)) { 
     errors.email = 'Podany adres jest nieprawidłowy' 
    } 
    return errors 
} 

function submit(values, dispatch) { 
     return new Promise((resolve, reject) => { 
      dispatch(actionCreators.loginUser(values.email, values.password)) 
      .catch(err => { 
       reject(err) 
      }) 
     }) 
    } 

class LoginForm extends Component { 
    constructor(props) { 
     super(props); 
     //this.onSubmit = this.onSubmit.bind(this); 
    } 
    render() { 
     const { error, handleSubmit, pristine, reset, submitting } = this.props 
     return (
      <form onSubmit={handleSubmit(submit)}> 
       <div> 
        <Field name="email" 
        component={renderTextField} 
        label="Email"/> 
       </div> 
       <div> 
        <Field name="password" 
        component={renderTextField} 
        type="password" 
        label="Hasło"> 
         {error && <strong>{error}</strong>} 
        </Field> 
       </div> 
       <br/> 
       <div> 
        <RaisedButton label="Zaloguj" 
        primary={true} 
        type="submit" 
        disabled={pristine || submitting} /> 
        <RaisedButton type="button" 
        disabled={pristine || submitting} 
        onClick={reset}>Reset 
        </RaisedButton> 
       </div> 
       <br /> 
      </form> 
     ) 
    } 
} 
reactMixin(LoginForm.prototype, LinkedStateMixin); 

const mapStateToProps = (state) => { 
    return { 
     user: state.user.user, 
     isAuthenticated: state.user.isAuthenticated 
    } 
} 
// const mapDispatchToProps = (dispatch) => { 
//  return { 
//   actions: bindActionCreators(actionCreators, dispatch) 
//  } 
// } 
const form = reduxForm({ 
    form: 'LoginForm', 
    validate, 
    onSubmit: submit 
})(LoginForm); 

export default connect(mapStateToProps)(form); 

Answer 1

，因为它看起来在惊鸿一瞥，还有的submit()函数内部一些未被捕获的错误（如日志说...）。

这是因为Redux-Form只捕获SubmissionError，但没有其他明显的错误。

因此，解决办法是处理自己的错误（例如派遣拒绝执行或catch块内submissionFailed动作）

例如：

function submit(values, dispatch) { 
    return new Promise((resolve) => { 
     dispatch(actionCreators.loginUser(values.email, values.password)) 
     .catch(err => { 
      //reject(err) 
      dispatch(someNewErrorAnouncingAction(err)) 
     }) 
    }) 
}