反应路由器 <Link /> 不工作

Question

我可以很好地加载我的组件及其子组件，但是<Link/>组件有问题。 我试图在我的主要应用程序组件中使用它，如下所示：

"use strict";
var React = require('react');
var Navigation = require('./navigation');
var UserActions = require('../actions/userActions.js');
var UserStore = require('../stores/userStore.js');

var App = React.createClass({

    getInitialState: function(){
        return { currentUser: "" }
    },

    componentWillMount: function(){
      var user = UserStore.getUser();
      this.setState({currentUser: user })
    },

    render: function(){
       return (
            <div>
                <div id="nav-container">
                  <Navigation user={this.state.currentUser}/> 
                </div>
                <div id="main-content"></div>
            </div>
        );
    }
});

module.exports = App;

这是我的导航组件的相关部分。 我可以手动导航到该URL，然后一切正常。

"use strict";
var React = require('react');
var Link = require('react-router').Link;


var Navigation = React.createClass({
   render: function(){
      return (
      {(this.isAdmin())?
          <div className="nav-parent">
              <p onClick={this.showChildren}>ADMIN TOOLS</p>
                 <ul className="child-nav">
                     <li><Link to={'admin/logos'}>Logos</Link></li>
                  </ul>
           </div>
         :null}
        )
   }
})

这是路线

     <Route path="/admin" component={require('./components/admin/admin.js')}>
         <Route path="logos" component={require('./components/admin/logos.js')}></Route>
  </Route>

单击“生成的响应”链接时，控制台中出现以下错误：

bundle.js: Uncaught TypeError: Cannot read property 'push' of undefined

手动导航到url可以正常工作。

Answer 1

尝试将您的Route声明更改为：

<Route path="/admin" component={require('./components/admin/admin.js')}>
    <Route path="logos" component={require('./components/admin/logos.js')} />
</Route>

和您的链接到：

<li><Link to={'/admin/logos'}>Logos</Link></li>

如果这不起作用，请在控制台的错误中单击更多详细信息箭头，然后检查错误发生的位置。