javascript - 当我更改地址栏中的路由时,React-Router 正在刷新页面

标签 javascript reactjs redux react-router react-redux

我正在使用 redux 和 react-redux 来更改我的应用程序的状态。

我有两个组件,LoginHome

如果用户正确登录并将他导航到 Home 组件,我将调度一个操作来更新状态。我在 Home 组件的路由中使用 authguard 来检查用户是否已登录。

但是当我通过在地址栏中键入路由导航到 Home 组件时,页面正在刷新并且状态更改为其初始值。

即使我使用地址栏导航到组件,如何保持状态值?

最佳答案

如果您使用地址栏导航到组件,则必须将数据存储在 localstorage 中。当您通过地址栏导航时,这有点像刷新页面,整个商店都丢失了。您必须再次 hydrate store 才能显示之前的 redux 状态。

您可以使用 redux-persist 等中间件或 redux-storage这将保存 redux 存储并在页面重新加载时补充 redux 存储。

关于javascript - 当我更改地址栏中的路由时,React-Router 正在刷新页面,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49548046/

相关文章:

javascript - 需要帮助使用 d3.js 创建堆积条形图

javascript - 严格模式默认绑定(bind) "this"关键字

node.js - 无法加载在 'flowtype' : Cannot find module 'package.json » eslint-config-react-app' 中声明的插件 'eslint/use-at-your-own-risk' 中的 npm 错误

javascript - 有人可以解释以下示例中 ...spread 运算符的使用吗?

javascript - 使用 Redux-Observable 调度延迟的第二个操作,同时保留第一个操作

javascript - 在表中的特定td下添加项目

javascript - vue.js this.$router 未定义

javascript - 如何捕获来自 redux-api-middleware 的响应

javascript - 如何根据 props 的值渲染组件?

javascript - 使用 React/Redux + Moment.JS 检查日期是否已更改