Доступ к состоянию редукции в новых вкладках / окнах

Я использую redux для хранения своего состояния. Он работает правильно, когда я перехожу на одну и ту же страницу (несколько компонентов, но на одной странице). Но когда я открываю ссылку в новой вкладке / окне, состояние становится неопределенным.

Основываясь на результатах, ожидается, что состояние redux сбрасывается при обновлении страницы или открытии в новой вкладке / окне. Затем я подумал о том, чтобы передать store.getState () в качестве параметра при переходе к другому компоненту, чтобы, если компонент видит, что состояние не определено, он получит доступ к своему состоянию свойств (переданному предыдущим компонентом).

Теперь, когда ссылка открывается в новой вкладке, мне нужно передать состояние. Я использую реагирующий маршрутизатор для навигации. В настоящее время состояние передается на другую страницу, когда я просто нажимаю на ссылку. Но когда я открываю ссылку в новом окне / вкладке, состояние снова становится неопределенным. Я использую это для перехода по указанной ссылке:

<Link to = {link}>{value}</Link>

где ссылка - это константа, содержащая путь и состояние (store.getState ()), которое мне нужно передать.

Я нашел много похожих вопросов о stackoverflow [например, программно-навигация-использование-реагировать-маршрутизатор]. Я пробовал использовать

<a onClick = {history.push(link)}>

но похоже, что это не работает. Может я неправильно использую. Остальные я просто не могу понять, как использовать / реализовать в этом контексте.

Пожалуйста, дайте примеры фрагментов кода помимо простого объяснения. Я новичок в redux / react.

Спасибо!

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

A.I 13.09.2019 14:16
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Навигация по приложениям React: Исчерпывающее руководство по React Router
Навигация по приложениям React: Исчерпывающее руководство по React Router
React Router стала незаменимой библиотекой для создания одностраничных приложений с навигацией в React. В этой статье блога мы подробно рассмотрим...
Массив зависимостей в React
Массив зависимостей в React
Все о массиве Dependency и его связи с useEffect.
0
1
2 857
1

Ответы 1

Первое, что вам следует проверить, это то, что вы используете правильную версию React-Router. Я не уверен, будет ли этот подход работать в чем-либо, кроме V4.

Если вы действительно используете React-Router V4, но он по-прежнему не работает. Другой более чистый подход, который вы можете использовать, который сохранит состояние не только после перенаправления на новые вкладки / окна, но и после обновлений, - это сохранить состояние вашего приложения в локальном хранилище.

Это видео Дэна Абрамова объясняет, как это сделать.

Спасибо! попробуем ваше предложение и сообщим вам.

shacy 28.10.2018 06:51

Другие вопросы по теме