React Hook Form — setValue. Какие существуют лучшие практики использования флагов shouldDirty/shouldValidate?
Есть форма с mode: onChange и зависимые друг от друга мульти-селекты: страны, регионы, города.
Пользователь может выбрать несколько стран, выбрать регионы для каждой, для каждого выбранного региона выбрать города.
Валидация простая: страны и регионы не должны быть пустыми, города могут быть пустыми
Я делаю следующее:
- когда удаляем выбранный регион - удалить все связанные с ним выбранные города
- когда удаляем выбранную страну - удалить все связанные с ней выбранные регионы и города
Для этого я на onChange вызываю
setValue('cities', filteredCities)
setValue('regions', filteredRegions)
Заметил что setValue опционально принимает 2 флага: shouldValidate, shouldDirty. Хотелось бы понять как их лучше использовать в каких ситуациях.
- shouldValidate - должны ли мы перезапускать ревалидацию поля которое мы косвенно меняем через setValue?
- shouldDirty - если мы меняем поле через setValue должны ли мы обозначать его как dirty?
В RHF setValue(..., { shouldValidate, shouldDirty }) это не про правильность/неправильность, а про контроль побочек/сайдов
shouldDirty имеет смысл ставить true только если ты хочешь считать это изменение пользовательским (влияние на unsaved changes). Для каскадных зависимых полей (чистка regions/cities после изменения countries) обычно ставят shouldDirty: false, иначе dirty-стейт превращается в мусор из автоправок.
shouldValidate включай там, где реально надо сразу обновить ошибки. Как правило — на required полях верхнего уровня. Для зависимых/вторичных полей чаще делают shouldValidate: false и после серии setValue вызывают trigger(['countries','regions']) точечно, чтобы не гонять валидацию на каждый чих.