javascript - React HashRouter不渲染其他路径，仅渲染根组件 '/'

Question

我的设置:

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/#/ 时rootpath，它正确呈现仪表板组件，如 routes.js 中所述。文件。但是当我导航到localhost/#/somepath时，它不渲染某个路径的组件，它仍在渲染 /成分。

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

Answer 1

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

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