REDUX-FORM V5:在编辑字段后如何清除/隐藏提交错误

Question

编辑：集中问题

我如何清除表单级提交错误，用于由Redux-formv。5.3.3？

包裹的表格

我以多种形式使用Redux-form，并具有任何不同步的提交行为。他们所有人都使用props.error获取提交错误以显示用户。

用户编辑表单字段时，错误消息将不再应用。因此，我想在下一次提交之前清除它（或至少，至少不向用户显示）。

编辑字段清除字段级错误属性（例如props.fields.email.error）。我还可以清除表单级错误属性？

另外，您是否可以建议一种可靠的方法来确定自提交以来已经编辑了一个或多个字段？我可以在这种情况下使用它来隐藏错误消息。

---

表单代码看起来像这样：

const MyForm = (props) => {
  const { fields: {name},
    error,
    handleSubmit,
    mySubmitHandler,
    submitting,
    ...otherprops
  } = props;
  return (
  <form onSubmit={ handleSubmit((values)=>{return mySubmitHandler(values, otherprops);}) }>
    <div className="error-message">{error}</div>
    <input {...name}>
  </form>
  );
};

和包装器：

function mapStateToProps(state) {
  return {
    user: state.authReducer.user
  };
}
function mapDispatchToProps(dispatch)
{
  return {
    mySubmitHandler: (values, props) =>{
      const { name } = values;
      const { user } = props;
      return dispatch(doAsyncAction(name, user))
      .catch(err=>{
        return Promise.reject({_error: err.message, name: err.message});
      });
    }
  };
}
function clientValidate(values)
{
  values = trimSpaces(values);
  const { name } = values;
  if (!name)
  {
    return {
      name: 'You must enter a name',
      _error: 'You must enter a name'
    };
  }
}
const fields = ['name'];
let MyFormContainer = reduxForm({
  form: 'myFormName',
  fields,
  validate: clientValidate,
  submitting: false
}, mapStateToProps, mapDispatchToProps)(MyForm);

export default MyFormContainer;

预先感谢！P.S.这与这个关于Redux-Form V6的未解决的问题相似（也许是相同？）。

---

原始问题：

我正在寻找的行为：

1. 用户用"不良"数据提交表单
2. 显示形式错误消息（对于整体表单，而不是针对特定字段），并且使用CSS
将字段文本颜色更改为红色
3. 用户单击字段
4. 文字转回黑色
5. 用户进行编辑（键入字符或删除char）
6. 错误消息消失

这似乎是非常标准的行为，但是到目前为止，我一直无法实现它。如果有一种内在的方式来执行此操作（或类似的事情），我很想听听。

编辑：

项目4通过字段进行处理。谢谢，@erik！

我想知道当用户重点重新回到字段时，或者至少在编辑字段时如何清除错误。

Answer 1

对您的字段值进行更改 will 删除v5中该字段的提交错误，因此您的＃6应该有效。

对于造型焦点的输入文本，您可以使用伪类:focus来完成，或者您建议使用redux-form提供的this.props.fields.myField.focus标志添加类。

if(myField.focus) {
   // set style to black
} else if(myField.touched && myField.error) {
   // set style to red
}