Управление данными с помощью компонентов React

Question

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

У меня есть 2 компонента:

• Адрес
• CreditCard

Каждый компонент имеет несколько входов и функций API для получения данных, а также для их обновления.

Когда я использую оба компонента на одной странице, как я могу запустить обновление для обоих компонентов?

Страница

• Адрес
• Кредитная карта
• Кнопка отправки

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

Answer 1

Redux

Для сложных взаимодействий между различными компонентами вы можете использовать redux .Redux хранит состояние всего вашего приложения и может быть обновлено только с actions.Действие вызовет reducer.Редуктор возвращает новую версию состояния с тем обновлением, которое вы там установили.

Относитесь к редуксу как к базе данных, не храните вещи несколько раз и сохраняйте хорошее разделение проблем ,Есть удивительная библиотека, которая позволяет вам собирать и обрабатывать данные, называемые Повторный выбор .

Повторный выбор

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

Заключение

В заключение, эти библиотеки являются частью стека, которым я пользуюсь около 2,5 лет (повторный выбор только 1 год).Я нашел их очень мощными для обработки сложных данных.При этом есть и другие варианты, такие как graphql, apollo или relay.