reactjs - 处理自定义 404 页面

reactjs - Handling custom 404 page

我正在尝试创建一个路由来捕获所有无效的 URL,然后在没有 Admin Layout 的情况下向用户显示我的自定义 404 页面。我的问题是,我的 404 页面总是显示管理布局(即使用户未登录)。我的 routes.js:

中有这些路线
export default [
 <Switch>
   <Route exact path="/password-reset" component={ResetPassword} noLayout />,
   <Route exact path="*" component={NotFound} noLayout/>
 </Switch>
];

我已将此位添加到我的 App.js 中的管理组件中:

const App = () => (

<Admin
    catchAll=         {NotFound}
    customRoute=      {routes}
>
</Admin>
);

知道如何处理 404 页面以捕获所有无效 URL 并且不会显示管理布局吗?

提前谢谢你。

对于 react-router < 4.0

如果要显示错误页面而不更改路径

<Route path='*' exact={true} component={errorcomponent} />

如果要显示错误页面并更改路径

<Route path='/error' component={errorcomponent} />
 // use redirect to  change the Url
<Redirect from='*' to='/error' />

对于反应路由器 4

保留路径

<Switch>
    <Route exact path="/" component={component} />
    <Route component={errorcomponent} />
 </Switch>

改变Url.

 <Switch>
    <Route path="/comp" component={component} />
   <Redirect to="/error" />
 </Switch>

无论你在交换机中放置路由标签的什么地方,都必须放置重定向标签。