Редукс форма или простая форма - PullRequest
Новая
       6

Редукс форма или простая форма

0 голосов
/ 24 октября 2018

Часто в ответах на вопросы слышно, что Почему следует использовать в ReactJ избыточную форму вместо простой формы.какие дополнительные обычные возможности он предоставляет разработчику?Тогда какой должен быть правильный ответ для этого.

Ответы [ 2 ]

0 голосов
/ 13 февраля 2019

Это упрощает жизнь, когда речь идет об интеграции форм в наши приложения React, а не объединяет их все вручную с Redux.

Все наши данные хранятся в хранилище Redux и каждый раз, когда пользователь меняетэлемент, мы называем создатель действия, который пытается изменить эти данные внутри Redux.

Форма Redux пытается автоматизировать часть этого процесса.

Таким образом, у нас может быть некоторый элемент ввода, который будетназначил значение и обработчик onChange нашим приложением, потому что мы никогда не позволяем DOM хранить информацию о нашем приложении.

У нас будет какой-то редуктор, который хранит все состояния различных форм внутри нашего приложения.

Все наши данные формы будут существовать в нашем хранилище Redux, и все эти данные поддерживаются редуктором.

Чтобы гарантировать, что мы можем получить данные из хранилища для элементов ввода, которые у нас будутmapStateToProps, который принимает данные формы и передает их нашим компонентам через реквизит.Затем мы гарантируем, что мы берем объект props и передаем их в различные элементы ввода в качестве значений.

Каждый раз, когда пользователь вносит изменение в элемент, у нас есть обработчик обратного вызова, который вызывает создателя действия и пытается обновить формуданные внутри хранилища Redux.

Форма Redux, по сути, собирается сделать все, что я написал для нас, потому что процесс, который я только что описал выше, настолько повторяется, Redux Form автоматизирует это для нас.

Форма Redux позволяет нам абстрагироваться от этой работы.Redux Form будет иметь редуктор, который мы подключим к нашему приложению.Он включен в библиотеку Redux Form.

Мы не собираемся писать какую-либо mapStateToProps функцию.Нам не придется писать действия создателей.Все, что нам нужно сделать, - это убедиться, что мы получаем некоторую информацию о форме в элемент ввода и гарантировать, что элемент ввода понимает, что он должен вызывать обработчик обратного вызова, предоставляемый формой Redux, каждый раз, когда он изменяется.Все это происходит за кулисами, автоматически с помощью Redux Form.

0 голосов
/ 24 октября 2018

Теперь известно, зачем сохранять данные формы в состоянии, и вы рассуждаете, если это имеет смысл для вашего приложения, мы можем вернуться к нашей основной теме.Учитывая, что приложение использует React и Redux, есть две основные опции:

  • ? реализует для каждого поля обработчик событий, который отправляет создателя действия, и редуктор, который получит действие… Все вещи с избыточностью.
  • ✔️ Или мы могли бы использовать библиотеку, которая сделает всю эту работу за нас.

Redux-Form - отличный вариант, чтобы выполнить эту работу для вас.Он отслеживает все общие состояния формы приложения , такие как:

  • Поля, которые находятся в форме;
  • Значения каждого поля;
  • Сфокусированное поле;
  • Если значения полей действительны;
  • Поля, с которыми взаимодействовал пользователь;
  • Если форма отправляется;
  • Если происходит какая-либо асинхронная проверка.

Тогда у Redux-Form не было устоявшейся альтернативы, но в настоящее время у нас есть отличные варианты, такие как Formik и Final-Form , и оба используют состояние компонента React.

При написании приложения Redux мы должны сохранить все данные, которые важны для приложения, в приложении.заявить, пока это имеет смысл.Но суть в том, что причина в том, что имеет больше смысла для вашего приложения, и выбор на ваш выбор.

Вдохновленный: Гильерме Гонсалвес

...