Перезагрузка URL в браузере в приложении React с использованием Redux и React Router, в результате чего состояние магазина не определено

Question

Я использую приложение create-реакции-приложение с реактив-редуксом и маршрутизатором-реактивом.

<SingleProduct /> определяется как таковое

function SingleProduct(props){
let id=  props.match.params.id
let products = props.products
return (display the matching product properties)
}

Когда <SingleProduct /> выполняет рендеринг, он полагается на идентификатор, полученный при маршрутизации. Затем он ищет идентификатор внутри props.products, чтобы получить определенные свойства продукта. <SingleProduct /> подключен к магазину редуксов следующим образом:

function mapStateToProps(state){
return {
products: state.products}
}

Когда я обновляю браузер, props.products больше не распознается, и я получаю ошибки при попытке прочитать свойства undefined.

Как я могу решить эту проблему? Это проблема маршрутизации (клиентская маршрутизация) или что-то еще? Я удалил свое приложение, попытался настроить конфигурацию Webpack для решения клиентской маршрутизации, но это не сработало. Обратите внимание, что я получаю продукты через REST API. Любая помощь приветствуется.

Answer 1

вам нужно использовать localalstorage или redux-persist в вашем проекте, чтобы сохранить сохраненные данные о состоянии после перезагрузки URL https://www.npmjs.com/package/redux-persist