鏈路

Question

點擊時做出反應路由器犯規路線，所以我有一對夫婦的鏈接標題組件：

{ 
    this.props.cats.map(x => 
     <li className="nav-item" key={x.path}><Link className="nav-link" to={x.path}>{x.name}</Link></li>) 
} 

上面的代碼段是我用來呈現鏈接

然後在我的指數.js（根）我使用<BrowserRouter/>它包含整個元素。

我的問題是關於我已經實施的路由。

<Header /> 
<Switch> 
    <Route exact path='/' component={(props) => <PostList cat='all' posts={this.props.posts} />} /> 
    <Route exact path='/:category' component={(props) => { 
    console.log(props.match.url) 
    return <PostList cat='filter' posts={this.props} /> 
    }} /> 
</Switch> 

當我點擊鏈接帶我去說路徑「/測試」，應該由第二Route元素，每次改變它應該顯示的鏈接時被拾起，事實並非如此。它只會改變，如果我做一個硬刷新。

任何想法，我可能做錯了什麼？

編輯*包含的頭組件

<nav className="navbar navbar-expand-sm navbar-light bg-light mb-3"> 
     <div className="container"> 
      <Link className="navbar-brand" to='/'>Navbar</Link> 
      <button className="navbar-toggler" data-toggle="collapse" data-target="#navbarNav"><span className="navbar-toggler-icon"></span></button> 
      <div className="collapse navbar-collapse" id="navbarNav"> 
      <ul className="ml-auto navbar-nav"> 
       { 
       this.props.cats.map(x => 
        <li className="nav-item" key={x.path}><Link className="nav-link" to={x.path}>{x.name}</Link></li>) 
       } 
      </ul> 
      </div> 
     </div> 
     </nav> 

Answer 1

鏈接現在的一部分「反應路由器-DOM」，確保你已經從那裏進口的吧，如果這不能解決您的問題然後嘗試用withRouter