У меня есть два компонента - Компонент A и Компонент B.
Компонент A:
- выбирает элементы с использованием некоторого API
- помещает полученные элементы в хранилище Redux,скажем, свойство items в объекте состояния приложения
- отображает количество элементов
Компонент B:
- выбирает элементы, используя тот же API, но предоставляяинформация подкачки (так что существует разбиение на страницы на стороне сервера)
- помещает извлеченные элементы в хранилище Redux в то же свойство items в объекте состояния приложения
- отображает извлеченные элементы в списке
Пользовательский сценарий:
Шаг 1. Пользователь открывает Компонент A.
Шаг 2. Пользователь переходит к Компоненту B.
Поскольку оба компонента имеют одно и то же свойство в объекте состояния приложения, как только пользователь открывает Компонент B - он сразу видит элементы, выбранные ранее Компонентом A, как они находятся в магазине.Компонент B начинает извлекать элементы и перерисовывает себя после извлечения данных.Таким образом, отображение элементов, произведенных извлечением компонента A, нежелательно.
Цель здесь - разделить два пользовательских сценария - работа с компонентом A и с компонентом B - и перестать компоненты, влияющие друг на друга.
Если я создаю два отдельных свойства в объекте состояния приложения - это будет противоречить рекомендациям Redux, данные будут денормализованы.Скажем, два свойства - appState.itemsCount и appState.items.
II имеют одно свойство - компоненты влияют друг на друга.
Пожалуйста, посоветуйте лучшие практики по работе с такими ситуациями.