Пользовательская проверка Formik для входного текстового поля на основе onBlur другого поля - PullRequest
Новая
       1

Пользовательская проверка Formik для входного текстового поля на основе onBlur другого поля

0 голосов
/ 08 мая 2019

У меня есть текстовое поле с именем A, которое не является обязательным. Если пользователь вводит какое-либо значение в поле A и пытается без ввода какого-либо значения в поле B, которое зависит от поля A, должно появиться сообщение проверки. 

   <Field.Input
            name={field.name}
            error={Boolean(validationMessage)}
            defaultValue={field.value}
            onBlur={(e) => {
              field.name === 'Name'
                ? e.target.value
                  ? (form.setFieldValue(field.name, error),
                    form.setFieldTouched(field.name))
                  : (form.setFieldValue(field.name, e.target.value), form.setFieldTouched(field.name))
                : form.setFieldValue(field.name, e.target.value)
              form.setFieldTouched(field.name)
            }}
          />

1 Ответ

0 голосов
/ 08 мая 2019

Запуск проверки в onFocus поля B. 

<Field
    name="fieldB"
    validate={() => {
        if (!values.fieldA) return 'Please fill fieldA';
    }}
    onFocus={() => validateField('fieldB')}
/>

Более подробную информацию о проверке, включая использование validate и validateField, можно найти в Документация Formik .

Код песочницы: https://codesandbox.io/s/zzpnzw8p3

Примечание: Кроме того, вы также можете отключить поле B, если поле A пустое. 

<Field
    name="fieldB"
    disabled={!values.fieldA}
    placeholder={!values.fieldA && 'Please fill fieldA'}
    ...
/>
...