ReactJS - List, Detail, New, Edit Pages - Когда загружать API формы данных с Redux?

Question

У меня есть несколько функциональных коллекций в моем приложении, каждая из которых имеет страницу списка, которая включает в себя таблицу, в которой перечислены все из них, страницу подробностей, нажимающую на одну из записей таблицы, страницу редактирования и страницу для создания новой,

Состояние коллекций управляется с помощью Redux и извлекается из бэкэнда.Каков общий шаблон для извлечения данных из бэкэнда в этом сценарии?

• Должен ли он быть выбран только страницей списка по умолчанию fetchAllObjects и затем передаваться при переходе на новую страницу (как props.history.push + state) и передается снова путем перемещения назад (например, при редактировании, сохранении и возврате на страницу сведений, чтобы отображались обновленные данные)
• или каждая дополнительная страница должна извлекать данные сноваиметь самую современную версию?Имеется в виду получить все объекты на странице списка, а также сделать fetchOneObject на странице сведений и редактирования, чтобы мне не нужно было передавать состояние с историей.

Answer 1

Я рекомендую сделать fetchAllObjects на странице списка, а затем передать конкретные детали на странице сведений в виде параметров или состояния, если вы используете response-router-dom или как реквизит, чтобы у вас не было устаревших данных.

Поток:

1. Извлечь список данных - после установки компонента убедитесь, что свежие данные видны

2. Получитьконкретная деталь и переход на страницу редактирования / обновления

3. Запрос на обновление api.

Всякий раз, когда компонент страницы списка монтируется, он запрашивает спискиданных.Или вы можете использовать redux-saga для прослушивания обновлений, получения списков данных и обновления магазина.

Answer 2

Вы можете делать обе вещи с помощью редукса.Но подумайте о случае, который был бы более оптимизированным.Подумайте, сколько звонков вам нужно сделать для бэкенда.

В первом случае вы можете сделать один вызов, когда componentDidMount, затем, когда вы перемещаетесь по страницам, вы можете просто использовать эти данные.Даже если вы делаете какие-либо обновления, вы можете сделать это и в своем магазине редуксов.Так что вы поддерживаете локальное хранилище резервов и хранилище бэкэндов в синхронизации и не нуждаетесь ни в каких дальнейших вызовах.

Но подумайте о втором случае, если вы вызываете backend каждый раз, тогда нет никакого смысла в использовании избыточности.

И, наконец, одно предложение: не передавайте реквизиты при использовании redux, вы можете просто подключить этот компонент к redux.Проходить реквизит легко, но он станет более беспокойным, когда у вас будет трафик реквизита.