Javascript 如果未通过身份验证,则从中的子路由重定向到父路由

Javascript 如果未通过身份验证,则从中的子路由重定向到父路由,javascript,reactjs,Javascript,Reactjs,如果用户未通过身份验证,我将尝试将其重定向到根url: import React from 'react'; import { Route, IndexRoute } from 'react-router'; import App from './components/App'; import LoginPage from './components/login/LoginPage'; import DashboardPage from './components/dashboard/Dashb

如果用户未通过身份验证,我将尝试将其重定向到根url:

import React from 'react';
import { Route, IndexRoute } from 'react-router';
import App from './components/App';
import LoginPage from './components/login/LoginPage';
import DashboardPage from './components/dashboard/DashboardPage';
import { Redirect } from 'react-router-dom';

export default (
  <Route path='/' component={App}>
    <IndexRoute component={LoginPage} />
    <Route
      path='/dashboard'
      render={props => (
        isAuthenticated() ?
          <DashboardPage {...props} /> :
          <Redirect to='/' />
      )}
    />
  </Route>
);
从“React”导入React;
从“react router”导入{Route,IndexRoute};
从“./components/App”导入应用程序;
从“./components/login/LoginPage”导入LoginPage;
从“./components/dashboard/DashboardPage”导入仪表板页面;
从'react router dom'导入{Redirect};
导出默认值(
(
是否已验证()?
:
)}
/>
);

我理解为什么这个例子不起作用-应用程序组件需要“子”道具,这些道具是嵌套组件,但这是呈现它们;我不明白的是,如果
isAuthenticated
在尝试导航到
/dashboard
-使用
component={…}时返回false,如何实现重定向
不起作用。

听起来您需要在该组件呈现上方的某个状态中设置一个身份验证步骤来确定这一点,如果未进行身份验证,您可以从
路由器使用
历史记录
,只需
this.props.history.push(“/”)
您是否使用react router v4?react router 2.4.0我不确定您的问题是什么,您的代码似乎正确。我会让我成为一个被认可的道具。这样,当isAuthenticated属性更改时,组件将重新提交,如果未经验证,则呈现重定向。