反应路由器未显示“未找到”页面

Posted 2023-02-21

【中文标题】反应路由器未显示“未找到”页面

【英文标题】：React Router Not Showing 'Not Found' Page

【发布时间】：2021-01-16 05:51:06

【问题描述】：

我似乎无法渲染我的 NotFound 组件。每当我在 url 中输入一些随机字符（例如：'localhost:3000/asdfasdfasdfasdf'）时，浏览器实际上会指向我的主题组件，没有内容。

这是我设置路线的方式：

import  BrowserRouter as Router, Route, Switch  from 'react-router-dom';

render()
  return (
    <div className="App">
      <Router>
        <NavBar />
        <Switch>
         <Route exact path='/' component=HomepageLayout />  
         <Route exact path='/:topic' component=Topic />  
         <Route path='*' component=NotFound />
        </Switch>
      </Router>
    </div>
  );
 

export default App;

我也尝试过不指定路径，正如一些人建议的那样，但这也不起作用：

<Route component=NotFound />

有什么想法吗？

【问题讨论】：

这能回答你的问题吗？ React-Router: No Not Found Route?

添加完整代码app.js。

我会将您的 /:topic 路由修改为 /topic/:topic 然后它应该按预期工作

谢谢，知道了。

【参考方案1】：

正如您在第二条路线中提到的那样，这将不起作用，因为任何值都可以作为 /:topic 保存，当您像这样添加时，这条路线将显示出来。因为，任何以冒号开头的段都将被视为参数。所以无论如何*路线都不会显示！