Question

我正在尝试创建一个可捕获所有无效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 中的Admin组件中：

const App = () => (

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

有什么想法如何处理404页面，以便它可以捕获所有无效的URL并不会显示管理布局？

先谢谢您。

Answer 1

对于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>

更改网址。

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

无论您在路由开关中放置路由标签的位置，都必须放置重定向标签。

reactjs-处理自定义404页面

1 个答案: