reactjs - React Router <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>

单击 react 生成的链接时，我在控制台中收到以下错误:

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

手动导航到该网址效果很好。

Answer 1

尝试将您的路线声明更改为:

<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>

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