ReactJS 路由 404 '*'一直在重定向

Question

我在这里遇到了一个小问题，当网址无效时，我试图放一个页面404，问题是，它一直在加载，例如，如果尝试访问我的主页将重定向到页面404，我尝试了一些例子但没有成功：

#redirect in all pages
<Redirect exact={true} from='*' to='/404' /> #test 1
<Redirect from='*' to='/404' /> #test2
#appear in the bottom of the pages
<Route exact={true} path='*' component={asyncComponent(() => import('./containers/Page/404'))} />
<Route path='*' component={asyncComponent(() => import('./containers/Page/404'))} />

Answer 1

尝试以这种方式使用

<Switch>
<Route path="/" exact component={Home}/>
<Route path="/will-match" component={WillMatch}/>
<Route component={NoMatch} />
</Switch>

无匹配的反应路由器文档

Answer 2

这就是我在最近的反应项目中配置路由的方式。

<Route exact path={`${process.env.PUBLIC_URL}/`} component={Main} />
<Route path='/new' component={ReportCreator}/>
<Route path='/reports/:id' component={Report}/>
<Route component={Page404} />

使用BrowserRouter和Switch路由器。

https://reacttraining.com/react-router/web/example/no-match