同步验证以抛出表单级错误（而不是字段级）

Question

在每个同步验证中 - https://redux-form.com/7.1.2/examples/syncvalidation/ - 我试图抛出表单级错误。就像我们做 throw new SubmissionError({ _error:'form level error from on submit' }) 时一样，但我无法弄清楚。我尝试使用特殊的 _error 键，甚至只是 error 键，如下所示：

reduxForm({
    validate: values => ({ error:'form level??', _error:'form level alt??' })
})

但是它没有设置 FormProps error 值。有谁知道这是否受支持或如何实现？

Answer 1

要在验证后将表单级错误传递给表单，您应该将 _error 属性添加到 redux-form config validate 函数返回的对象中。

错误将作为 error 属性传递给您的表单组件。

例如：

import React from 'react';
import { Field, reduxForm } from 'redux-form';

const ExampleForm = (props) => {
  const { handleSubmit, pristine, submitting, error } = props;
  return (
    <form onSubmit={handleSubmit}>
      <div>
        <label>Name</label>
        <div>
          <Field
            name="name"
            component="input"
            type="text"
            placeholder="Name"
          />
        </div>
      </div>
      <div>Error: {error}</div>
      <div>
        <button type="submit" disabled={pristine || submitting}>Submit</button>
      </div>
    </form>
  );
};

const validate = (values) => ({
  _error: `form level error for firstName = '${values.name || ''}'!`,
});

export default reduxForm({
  form: 'exampleForm',
  validate,
})(ExampleForm);

同步验证以抛出表单级错误（而不是字段级）

Sync validation to throw form level error (rather then field level)

redux-form