Reactjs 如何处理react路由器v4中嵌套路由的未找到页?
我在我的应用程序中有两个不同的部分,第一部分是站点,另一部分是管理面板。在这种情况下,我使用react router dom嵌套了路由,但我无法处理用于面板的url的未找到页面;例如,我想将/dashboard/something重定向到未找到页面 我的路线如下所示:Reactjs 如何处理react路由器v4中嵌套路由的未找到页?,reactjs,react-router-v4,react-router-dom,Reactjs,React Router V4,React Router Dom,我在我的应用程序中有两个不同的部分,第一部分是站点,另一部分是管理面板。在这种情况下,我使用react router dom嵌套了路由,但我无法处理用于面板的url的未找到页面;例如,我想将/dashboard/something重定向到未找到页面 我的路线如下所示: <Switch> {/* portal */} <Route exact path='/' component={Portal} /> <Route path="/landin
<Switch>
{/* portal */}
<Route exact path='/' component={Portal} />
<Route path="/landing" component={Portal} />
<Route path="/login" component={Portal} />
<Route path="/callback" component={Callback} />
<Route path="/activation" component={Portal} />
<Route path="/confirmation" component={Portal} />
<Route path="/opportunities/:id" component={Portal} />
<Route path='/panel' component={Portal} />
<Route path='/electiondetails/:id' component={Portal} />
<Route path='/errors' component={Portal} />
{/* election panel */}
<Route path='/electionpanel' component={Portal} />
{/* dashboard */}
<Route path='/dashboard' component={Index} />
<Route path='/dashboard/login' component={Index} />
<Route path='/dashboard/cartable/requests' component={Index} />
<Route path='/dashboard/elections-management' component={Index} />
{/* not found */}
<Route path="/404" component={Portal} />
<Redirect from="/**/" to="/404"></Redirect>
</Switch>
{/*门户*/}
{/*选举小组*/}
{/*仪表板*/}
{/*未找到*/}
/dashboard/something
始终与以下路线匹配:
<Route path='/dashboard' component={Index} />
此外,您不需要重定向到404页面,只需在不带路径的情况下放置一条路线
:
替换
<Route path="/404" component={Portal} />
<Redirect from="/**/" to="/404"></Redirect>
与
您可以直接使用此命令-``无需重定向。如果没有路径与此路由匹配,则它将显示门户。不幸的是,事实并非如此,当url错误时,门户和仪表板的环境是不同的,例如/dashboard/SomethingError,然后重定向到未找到的页面,但在我的应用程序中,当url是/dashboard/SomethingError时,显示白色页面,无任何内容。非常感谢您的帮助,我还有一个问题,现在我可以重定向到另一个未找到的页面吗?或者所有错误的url都会转到同一个404页面?@NasrinGhelichkhani salam!是的,那是可能的。例如,在404页面中,您可以呈现另一个重定向以导航到更具体的404页面。
<Route path="/404" component={Portal} />
<Redirect from="/**/" to="/404"></Redirect>
<Route component={Portal} />