javascript - 配置react-router v4

标签 javascript reactjs react-router frontend

我有两个页面,管理页面和登录页面。如果用户未登录,管理页面必须重定向到登录页面,如果用户登录,登录页面必须重定向到管理页面。

在react-router v3中我有onEnter和onChange方法,在这个方法中我可以存储并查看用户是否登录以及replace路由,但是在v4中不存在这个方法,所以所有包含 onEnter 和 onChange 方法的逻辑我必须放入组件中,例如在 componentWillReceiveProps 中?

谢谢!

最佳答案

是的。在react-router v4中,路由被视为另一种类型的组件。路由只是一个组件,如果浏览器位置与给定路径匹配,则渲染另一个给定组件,这就是它的全部作用。由于这种设计决策,专门针对路由设置另一组生命周期方法没有多大意义,我们可以利用 React 组件生命周期方法。根据我的经验,它几乎涵盖了react-router v3生命周期钩子(Hook)支持的所有用例。

就您而言,您可以简单地输入条件 <Redirect/> 在管理组件和登录组件的 JSX 中添加标记以使其正常工作。此外,这种情况在新的react-router 4 docs中得到了很好的解释。 .

关于javascript - 配置react-router v4,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44183424/

相关文章:

javascript - 使用 LazyLoad 时最大的 Contentful Paint 显着增加

javascript - XUL:直接上传到 S3,但不使用文件输入元素

javascript - 对数 slider

javascript - 确定是创建新对象还是更新现有对象

node.js - 如果不存在,如何使用 Browserify 创建新目录?

reactjs - 如何告诉 webpack 开发服务器为任何路由提供 index.html

javascript - React、React Hooks、useEffect 内不同的 console.log 打印顺序

javascript - react : how to get input value from one component to make the ajax call in another component?

reactjs - 在 react 路由器 dom v6 中渲染

路径不匹配时 react 路由器渲染菜单