如何在不同的 URL 路由之间保存 redux 状态？

Posted 2023-02-22

【中文标题】如何在不同的 URL 路由之间保存 redux 状态？

【英文标题】：How to save redux state between different URL routes?

【发布时间】：2018-11-25 19:32:23

【问题描述】：

我在 www.infinity2o.com 上有一个带有多个路由的 react/redux webapp：

<Route exact=true path="/profile" component=Profile />
<Route exact=true path="/sorting_hat" component=SortingHat />

我遇到的问题是我的 UI 颜色主题已保存到我的 redux 商店中。但是每次我的 URL 路由从infinity2o.com/profile 更改为infinity2o.com/sorting_hat 时，我的整个状态都会重置为null。

在路由之间切换时是否可以保持我的一些 redux 状态持久化？

【问题讨论】：

您也可以通过您的服务 API 使其可用，以便根据 URI 返回特定主题并将其设置为状态。

通常在路由之间导航（在类似 react 的 SPA 中）不会重置状态，除非您刷新应用程序（F5），并且我们需要将状态保留在商店之外，以防我们的应用程序完全刷新，但在您的情况下（并且您正在使用 react-router）导航到另一条路线不应真正重置您的商店，另一件可以帮助您的事情是使用来自 react-router-redux 的 LOCATION_CHANGE 事件检测到路由变化，然后你就可以处理状态了。

【参考方案1】：

你可以尝试使用 redux-persist 库