Redux Form - как отключить синхронизацию / асинхронную проверку с флагом - PullRequest
Новая
       42

Redux Form - как отключить синхронизацию / асинхронную проверку с флагом

0 голосов
/ 09 января 2019

Я ищу наиболее неинвазивный способ отключить проверку формы редукса для целей разработки / отладки.
У меня есть форма мастера, похожая на туториал https://redux -form.com / 8.1.0 / examples / wizard / , но я использую валидаторы полей плюс асинхронный валидатор
Я все еще хотел бы отображать ошибки, но смог бы перейти к следующему шагу мастера, даже если проверка не удалась
Я хотел бы добавить флаг в URL-адрес, как? Ignore-validation = true (с использованием маршрутизатора реакции)

вот фрагмент моего мастера step1: 

export class CustomerStep1 extends React.PureComponent<FormProps> {
    render(): React.Node {
            const {
                handleSubmit,
            } = this.props;

            const submit = handleSubmit(createValidateCardAction);

            return (
                    <form onSubmit={submit}>

                                    <Field
                                        name="card_number"
                                        placeholder="7777 1234 5678 9012"
                                        component={Input}
                                        validate={cardNumber}
                                    />
...

export default reduxForm({
    form: 'customerWizard',
    destroyOnUnmount: false,
    forceUnregisterOnUnmount: true,
})(CustomerStep1);

1 Ответ

0 голосов
/ 10 января 2019

Я вижу две возможности здесь:

1) Разделите ваши формы мастера на несколько форм и проверьте их отдельно. Вы можете создать другое состояние, чтобы контролировать, какую форму вы хотите показать. Несмотря на то, что у него больше состояний, я бы выбрал его.

2) Вы можете оставить только асинхронную проверку для каждого поля и добавить туда ошибки. Кроме того, вы должны создать состояние для управления страницей и управления ею внутри функций асинхронной проверки. Я создаю пример этого второго подхода: https://codesandbox.io/s/o46k8lx7kz

...