Как правильно подтягивать данные и хранить их при переходе на страницу товара?

Question

[1233211]

Подскажите как правильно сделать.
Есть страницы с информацией о товаре:
pages/goods/[id].tsx

при переходе на страницу, достаю id товара из router.query.id и делаю запрос внутри useEffect и сохраняю в state компонента. Правильно ли я делаю или лучше как-то иначе?
Мне ещё во внутренние компоненты нужно прокидывать state.
Может для этого лучше использовать redux?

Comments

[Алексей Дубровин]

Подтягивайте, как попали на страницу с товаром.
Там же и храните.

[1233211]

Алексей Дубровин, почему это будет лучше, чем хранить в редаксе?

[Farkl]

1233211, и на сколько большая вложенность внутренних компонентов?

[Алексей Дубровин]

1233211,
А зачем вам в редаксе хранить текущую страницу?
Эта страница буквально содержит информацию о этом товаре.

[Farkl]

Алексей Дубровин, не тому ответили)

[Gimir]

Я бы сделал Контекст, который берет айдишник с квери и делает запрос как описано в вопросе. Только так не придется прокидывать стейт через пропсы.

[1233211]

Gimir, но с другой стороны грубо говоря это тоже самое, что и редакс.

[Gimir]

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

Answer 1

[romaro]

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

Вот здесь есть примеры кода.