Redux Forms - игнорировать initialValues ​​без зарегистрированного поля - PullRequest
0 голосов
/ 03 января 2019

У меня есть объект, извлеченный с сервера, который содержит множество полей, не относящихся к текущей форме.Я хотел бы передать весь объект в initialValues ​​в моей форме, но когда я отправляю, я не хочу, чтобы дополнительные поля переносились.

Вот простая форма:

const MyForm = ({ handleSubmit }) => (
  <form onSubmit={handleSubmit}>
    <Field name="name" component="input" placeholder="Name" />
    <button type="submit">Submit</button>
  </form>
);

export default reduxForm({
  form: "foo",
  onSubmit: values => {
    console.log(values);
  },
})(MyForm);

И в его родительском компоненте он отображается следующим образом:

<MyForm initialValues={{ name: "bob", other: "thing" }} />

Когда я отправляю форму, я хочу, чтобы значения выглядели следующим образом:

{name: "bob"}

и не включали дополнительные other поле.Возможно ли это?

Поскольку дополнительные поля не видны конечному пользователю, они не должны быть частью возможного запроса исправления формы.Я также не хочу, чтобы мой родительский компонент был тесно связан с формой, поэтому я не хочу фильтровать поля на этом уровне.

1 Ответ

0 голосов
/ 20 февраля 2019

Мы решили эту проблему, обернув форму компонентом более высокого порядка.Затем вы можете обернуть переданный обработчик отправки и выполнить некоторую логику для значений, возвращаемых формой, прежде чем они будут отправлены в обработчик отправки:

export function specialForm(WrappedForm) {

  return class extends Component {
    submissionFilter(submitFunction) {
      return function(values, dispatch, props) {
        // Only let registered fields through.
        if (props.registeredFields) {
          values = _.pick(values, Object.keys(props.registeredFields));
        }

        return submitHandler(values, dispatch, props)
      }
    }

    render() {
      var submitHandler = this.props.onSubmit;
      if (submitHandler) {
        submitHandler = this.submissionFilter(submitHandler);
      }
      return <WrappedForm {...this.props} onSubmit={submitHandler} />;
    }
  };
}

Ключом к выполнению этой работы является тот факт, чтореквизиты формы передаются как третий аргумент в обработчик отправки, а реквизиты имеют атрибут registeredFields, который является полями в самой форме.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...