reactjs – 如何使用flash消息react-router 4重定向

发布时间：2020-12-15 07:25:32 所属栏目：百科来源：网络整理

导读：这就是我想要实现的目标：当用户尝试访问我的ReactJS站点上的受保护页面时,我想将它们重定向到主页,并显示“请登录”或类似内容的flash消息.我如何使用react-router v4实现这一目标.这是我到目前为止所拥有的： Routerdiv Switch Route path="/" component={

这就是我想要实现的目标：当用户尝试访问我的ReactJS站点上的受保护页面时,我想将它们重定向到主页,并显示“请登录”或类似内容的flash消息.我如何使用react-router v4实现这一目标.这是我到目前为止所拥有的：

<Router>
<div>
  <Switch>
    <Route path="/" component={Home} />
    <Route 
      exact path="/source" render={() => (
        isAuthenticated() ? (
          <Source />
        ) : (
          <Home /> //I want to Redirect to the Home Page with a flash message if user is not logged in
        )
      )} 
    />
    <Route path="/contact" component={ContactUs} />
  </Switch>
</div>
</Router>,);

解决方法

这对我有用：我使用了react-router v4附带的Redirect方法.它使您可以轻松实现这一目标.

<Route 
      exact path="/source" render={() => (
        isAuthenticated() ? (
          <Source />
        ) : (
          <Redirect 
            to={{
              pathname: '/',state: 'Please sign in' 
            }} 
          />
        )
      )} 
    />

您可以在此处阅读有关重定向的更多信息：React Router v4 – Redirect

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!