Question

  <Router history={history}>
      <div className="container">
        <Navbar />
        <Switch>
          <Route exact path='/' component={HomePage}/>
          <PublicRoute exact path='/signup' component={Signup}/>

          <Route component={NotFoundPage} />
        </Switch>
        <Footer />
      </div>
  </Router>

这在使用Link时工作正常，但是当我尝试使用NavLink时，它不会添加activeClass，因为，我想，＆lt; Navbar /＆gt;在Switch之外，因此它没有位置支柱。我该如何解决这个问题？

Answer 1

作为Router组件的一个孩子，我本来期望在Navbar上有一个诸如位置或历史的道具 - 我会再次检查以查看Navbar上与导航相关的道具。否则，您可以将history对象传递给Navbar组件，就像将其传递给Router组件一样？

Answer 2

我找到了答案，我只是在<Navbar />内写了<Route />，就像其他一切一样，

<Route path='/' component={Navbar}/>

React Router - 如何在每个页面上添加导航栏以及NavLink activeClass

2 个答案: