javascript - React 路由器仅在按下后退按钮时起作用

Question

我有一个非常简单的 react 路由器设置，但无法正常工作。当我导航时，URL 栏发生变化，但 react 路由器永远不会更新页面。如果我重新加载页面，则会在初始加载时呈现正确的路线。如果我按下后退/前进按钮， react 路由器会在路线之间正确导航。即使当后退/前进与 react 路由器一起使用时，单击我可以通过后退/前进到达的页面链接仍然没有任何反应。

我的路线

import { Router, Route, IndexRoute, browserHistory } from 'react-router'
import AppContainer from './components/react/app_container.jsx'
import Signup from './components/react/login_and_signup/signup.jsx'
import SplashPage from './components/react/splash_page/splash_page.jsx'
export const routes = (
    <Router history={browserHistory}>
        <Route path="/" component={AppContainer}>
            <IndexRoute component={SplashPage} />
            <Route path="signup" component={Signup} />
        </Route>
    </Router>
);

引导我的应用程序

import ReactDOM from 'react-dom';
import {routes} from '../imports/client/routes'

ReactDOM.render(routes, document.getElementById('app'));

我的应用程序容器

import React from 'react';

let AppContainer = React.createClass({
    componentWillReceiveProps(nextProps){
      console.log("next props? ", nextProps);
    },
    render(){
        return <div>{this.props.children}</div>
    }
});

export default AppContainer;

在我的启动页面中:

<Link to="/signup">
   signup
</Link>

这是我得到的行为:

1. 在/URL 重新加载页面，启动页面加载
2. 点击注册链接，URL更改为/signup，但注册组件未渲染，且componentWillReceiveProps中的console.log未输出
3. 在/signup 上重新加载页面，并且注册组件正确呈现
4. 按下后退按钮，启动页组件正确渲染，并且 props 从 componentWillReceiveProps 输出
5. 前进和后退按钮此时工作正常
6. 点击初始页面上的注册链接，URL 更改为/signup 但没有任何反应

据我所知，我已经正确配置了所有内容，但除了后退/前进按钮之外， react 路由器默默地失败了。

我使用的是 React 15.0.1 和 React Router 2.4.1。

Answer 1

meteor 包 Iron Router 包含在我的项目中，并且与 React Router 发生冲突。删除 Iron Router 解决了问题。