React HashRouter 不渲染其他路径,只渲染根组件'/'

React HashRouter not rendering other paths, only Rendering root component '/'

我的设置:

routes.js

const Router = () => (
  <Switch>
    <Route path="/" component={ Dashboard } />
    <Route path="/somepath" component={ SomePath } />
  </Switch>
);

index.js

<HashRouter>
  <App />
</HashRouter>

app.js:

lass App extends Component {
  render() {
    return (
      <div className="main-app">
        <Header />
        <div className="page__container">
          <Router />
        </div>
        <Footer />
      </div>
    );
  }
}

问题是,当我导航到 localhost/#/ 根路径时,它正确呈现 routes.js 文件中提到的仪表板组件。但是当我导航到 localhost/#/somepath 时,它不会为某个路径渲染组件,它仍然在渲染 / 组件。

即使在 React Devtool 它显示 <Route path="/"> 已加载,而不是 <Route path="/somepath">

您可能需要添加 exact 以匹配路径。将 exact 属性添加到 Route

<Route exact path="/somepath" component={ SomePath } />