React Router activeClassNameがクラスをアクティブなルートに変更していません

Question

React Routerに奇妙な問題があります。 activeClassNameは、 '/'から子コンポーネントにナビゲートする場合にのみ有効です。しかし、私が 'update'から 'updatepassword'にナビゲートしようとすると動作しません。それはアクティブなクラスを更新ビューに維持し、逆もまた同様です。これは、 '/'からナビゲートした後、最初にどのルートにヒットしたかによって異なります。私はルートに

<Provider store={store}> 
    <Router history={hashHistory}> 
     <Route path="/" component={ Template } > 
     <IndexRoute component={ Welcome } /> 
     <Route path="login" component={ Login } /> 
     <Route path="register" component={ Register } /> 
     <Route onEnter={requireLogin}> 
      <Route path="update" component={ Update } /> 
      <Route path="updatepassword" component={ Update_password } /> 
     </Route> 
     </Route> 
    </Router> 
    </Provider> 

リンクを定義する方法

：以下の私のコードを見てみてください

 <nav className="navbar navbar-default navbar-fixed-top"> 
     <div className="container"> 
      <div className="navbar-header"> 
      <button type="button" className="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false"> 
       <span className="sr-only">Toggle navigation</span> 
       <span className="icon-bar"></span> 
       <span className="icon-bar"></span> 
       <span className="icon-bar"></span> 
      </button> 
      <Link to={ '/' } className="navbar-brand">React-Phoenix-Chat</Link> 
      </div> 
      <div className="collapse navbar-collapse" id="navbar"> 
      <ul className="nav navbar-nav navbar-right"> 
       <li> <a onClick={this.handleLogout.bind(this)} href="#" activeClassName="active">Logout</a></li> 
       <li><Link activeClassName="active" to={ 'update' }>Update</Link></li> 
       <li><Link activeClassName="active" to={ 'updatepassword' }>Update Password</Link></li> 
       <li><a href="#">{this.props.user.username}</a></li> 
      </ul> 
      </div> 
     </div> 
     </nav> 

Answer 1

は私が問題を発見しました。これに

<Route onEnter={requireLogin}> 
    <Route path="/update" component={ Update } /> 
    <Route path="/updatepassword" component={ Update_password } /> 
</Route> 

：私はこれを変更しなければならなかった

<Route path="/update" component={ Update } onEnter={requireLogin} /> 
<Route path="/updatepassword" component={ Update_password } onEnter={requireLogin} />