Comments 12
Вместо Redux-Form, React-Redux-Form используйте react-final-form или formik. Они не используют Redux и имеют довольно удобное и гибкое API, валидация и проч. плюшки в комплекте.
Тема глубже, попробуйте реализовать добавление маски и форматирования в пропсы филда формы !?)
спасибо за комментарий, я эту тему уже развиваю, но здесь всё не поместилось.
На одном из проектов мне приходило от сервера описание формы в виде массива с объектами, в которых были тип каждого инпута, атрибуты и прочее. Надо было слать предварительный запрос для создания формы, а потом из полученных данных её собирать. Я постараюсь написать об этом следующую статью.
На одном из проектов мне приходило от сервера описание формы в виде массива с объектами, в которых были тип каждого инпута, атрибуты и прочее. Надо было слать предварительный запрос для создания формы, а потом из полученных данных её собирать. Я постараюсь написать об этом следующую статью.
Давать идентификатор в автоматическом ком режиме каждому опасно. Вы уже помечтили инпут внутрь тэга матки и этого достаточно чтобы их связать
const isValid = Object.keys(data).reduce(
(sum, item) => sum && this.validate(item, data[item]),
true
);
Array.prototype.every? :)
Мне кажется метод validate работает не так как ожидается. Указание второго параметра в setState это callback который будет вызыван асинхронно в тот момент когда стейт изменится. В этот callback можно написать какyю-то дополнительную логику но возвращаемое значение будет проигнарировано. Поэтому в строке () => false нет смысла. Но почему же тогда все работает?! Похоже что в случае, когда строка пустая метод возвращает undefined, который в логическом выражении неявно приводится к false. Мне кажется следут явно написать return false, это сделает код более понятным.
Спасибо за статью, поясните пожалуйста, зачем нужна ещё одна обёртка, почему не передавать initialState, requiredFields во Wrapper?
Всегда пожалуйста, вам тоже спасибо за комментарий и прошу прощения, что долго не отвечал.
Это сделано для больше для удобства, в целом, можно передать начальные значения и во Wrapper, а потом перед возвращением нового класса обработать эти значения и передать в конструктор. Кроме удобства это делается для разделения ответственности, как правило HOC получает только компонент и возвращает компонент, а вся логика обработки дополнительных значений вынесена на уровень выше, например, если посмотреть тот же connect из react-redux, он реализован примерно также. Кроме этого, на официальном сайте говорится, что такой паттерн предпочтительней
https://reactjs.org/docs/higher-order-components.html
Это сделано для больше для удобства, в целом, можно передать начальные значения и во Wrapper, а потом перед возвращением нового класса обработать эти значения и передать в конструктор. Кроме удобства это делается для разделения ответственности, как правило HOC получает только компонент и возвращает компонент, а вся логика обработки дополнительных значений вынесена на уровень выше, например, если посмотреть тот же connect из react-redux, он реализован примерно также. Кроме этого, на официальном сайте говорится, что такой паттерн предпочтительней
https://reactjs.org/docs/higher-order-components.html
Sign up to leave a comment.
Работа с формами в React.js, используя базовый инструментарий