Проверка наличия файла с помощью YUP - PullRequest
Новая
       10

Проверка наличия файла с помощью YUP

0 голосов
/ 20 сентября 2018

Я использую Да для проверки моей формы.В одной из моих форм я хочу проверить, что у одного <input type="file" /> есть файл.

Я проверил это (и оно не работает): 

Yup.object().shape({
  file: Yup.object().shape({
    name: Yup.string().required()
}).required('File required')

У меня естьследующее сообщение об ошибке в консоли:

файл должен иметь тип object, но окончательное значение было: null (приведено из значения {}).Если «null» подразумевается как пустое значение, обязательно пометьте схему как .nullable()

Есть идеи?

1 Ответ

0 голосов
/ 28 ноября 2018

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

Когда запускается валидатор, он проверяет, что тип поля сначала совпадает.В этом случае он проверяет, является ли это объектом.Так как это не так и поле не помечено как nullable, оно не проходит проверку с ошибкой типа.Yup никогда не доходит до точки запуска required(), так как он освобождается рано.

Так как нам настроить сообщение, отображаемое, когда тип не совпадает, и вы не хотите использовать метод nullable()?Я посмотрел на источник и обнаружил, что сообщение генерируется здесь .Так что это часть локали объекта.Таким образом, мы можем решить это следующим образом. 

import * as Yup from 'yup';
import { setLocale } from 'yup';

setLocale({
  mixed: {
    notType: '${path} is required',
  }
})

Yup.object().shape({
  file: Yup.object().shape({
  name: Yup.string().required()
}).label('File')

Теперь, когда тип неправильный, будет отображаться ваше новое сообщение.Метод label() позволяет установить хорошее отображаемое имя для поля, поскольку сообщение будет использоваться в любых недопустимых ситуациях типа в валидаторах.

Другой альтернативой является написание специального валидатора специально для этого поля,но в этом сценарии это кажется излишним.

...