1

При помощи redux-form делаю форму. Соответственно, примерно так выглядит форма:

<form onSubmit={handleSubmit}>
    <Field name={name} component={component} validate={validators}/>
</form>

Ещё в отдельном файле у меня есть валидаторы:

export const required = value => value ? undefined : 'Это полe обязательное';
export const nonMatchPipe = answer => answer.match('\\|') ? 'Ответ не должен содержать символ |' : undefined;

А теперь возникает интересный феномен. Вот такой набор валидаторов работает нормально:

<Field name={name} component={component} validate={[required, nonMatchPipe]}/>

И если оставить валидатор required, то всё тоже нормально:

<Field name={name} component={component} validate={[required]}/>

Но если я оставляю только валидатор nonMatchPipe, то возникает ошибка

TypeError: Cannot read property 'match' of undefined`.

Почему возникает ошибка? Как её решить?

2
  • Похоже что аргумент answer в функции nonMatchPipe не успевает с инициализацией что и говорит undefined. Можно конечно еще так попробовать - export const nonMatchPipe = answer => { if(answer) { return answer.match('\\|') ? 'Ответ не должен содержать символ |' : undefined; }
    – Austral1a
    2 мая 2021 в 8:53
  • @dresser сейчас попробую. А что это вообще происходит с точки зрения JS? Почему он может не успевать с инициализацией? Очень неочевидная ошибка.
    – Zhenyria
    2 мая 2021 в 17:21

1 ответ 1

1

Я не очень хорошо понимают механизмы JS, но да, почему-то без предварительной проверки на то, что текст существует, вызов match() у текста выбрасывает ошибку. Решается это довольно простым способом:

export const nonMatchPipe = answer => answer && answer.match('\\|')
    ? 'Ответ не должен содержать символ |'
    : undefined;

Это немного похоже на проверку Objects.requireNonNull() в Java, только в Java это необязательная к исполнению рекомендация, а в JS из-за этого возникает ошибка.

UPD от 22.07.21

Больше похожая на правду причина ошибки заключалась в том, что валидатор вызывается при любом изменении формы, в том числе при изменении полей, которые находятся в той же форме, что и поле, в котором установлено валидатор. И если поле, в котором находится валидатор, у нас не имеет значения, то попытка провалидировать undefined вызывает ошибку.

Например, в нашей форме есть поля name и surname. На surname установлен такой валидатор:

export const nonMatchPipe = surname => surname.match(/\|/g) 
    ? 'В фамилии не может быть символа |' 
    : undefined;

Если мы работаем с полем name, то это создаёт вызов валидаторов. И если валидатор вызовется у пустого поля surname, то это создаст ошибку из-за попытки вызвать функцию match() у undefined.

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.