我正在尝试使用routes.js包在我的反应路由器文件中创建默认路由。
这是我的密码:
import React from 'react';
import { Route, Switch, Router, Redirect, BrowserRouter } from 'react-router-dom';
import { createBrowserHistory } from 'history';
import MainContainer from './containers/main';
const Routes = () => (
<BrowserRouter>
<Switch>
<Route path='/' component={MainContainer} />
<Redirect from='/' exact to='/main'/>
</Switch>
</BrowserRouter>
);
export default Routes;但它不会将/重定向到/main。基本上,每当用户转到/时,它都应该重定向到/main。此外,当我构建应用程序时,/main应该是起点(主页)。我正在使用创建-反应-应用程序样板CLI。
谢谢。
发布于 2020-03-01 16:06:19
要获得所需的效果,首先应该将重定向移动到开关的顶部。
其次,您必须将路由的" to“属性更改为/main。因为这是要加载MainContainer组件的位置。
就像这样:
import React from 'react';
import { Route, Switch, Router, Redirect, BrowserRouter } from 'react-router-dom';
import { createBrowserHistory } from 'history';
import MainContainer from './containers/main';
const Routes = () => (
<BrowserRouter>
<Switch>
<Redirect exact from='/' to='/main'/>
<Route path='/main' component={MainContainer} />
</Switch>
</BrowserRouter>
);
export default Routes;在您发布的代码中,所有位置都会转到路由组件,因为它们都包含/。因此,开关永远不会击中重定向。
在我的示例中,当位置正好是时,重定向就会被击中。然后,它将用户重定向到/main,在那里,交换机将命中加载您的组件的路由。
https://stackoverflow.com/questions/60476764
复制相似问题