react-router 1.0.0-rc3 - 所有 URL 都映射到一个 React 组件答案

【问题标题】：react-router 1.0.0-rc3 - All URLs are are mapped to only one React componentreact-router 1.0.0-rc3 - 所有 URL 都映射到一个 React 组件
【发布时间】：2016-01-14 22:39:06
【问题描述】：

我有以下路线：
routes.jsx

var routes = (
    <Route component={AfApp} path="/">
        <Route path="/testpage" component={Test}/>
        <Route path="testpage" component={Test}/>
    </Route>
);

module.exports = routes;

但是当我导航到mydomain/testpage、mydomain/testpage/ 和mydomain/whatever 时，只呈现了 AfApp 组件，而不是 TestPage 组件或任何其他组件！

出了什么问题？
AfApp.jsx

export default class AfApp extends React.Component {
    render() {
        console.log('render');

        return (

            <div>
                {this.props.children}
            </div>
        );

    }
}

entry.jsx

import routes from './routes.jsx';
ReactDOM.render(<Router routes={routes} />, document.getElementById('content'));

React 版本是 0.14.0

我的页面中包含的 bundle.js 包含以下内容：

var _appComponentsTestJsx2 = _interopRequireDefault(_appComponentsTestJsx);

var routes = _react2['default'].createElement(
    _reactRouter.Route,
    { component: _appComponentsAfAppJsx2['default'], path: '/' },
    _react2['default'].createElement(_reactRouter.Route, { path: '/testpage', component: _appComponentsTestJsx2['default'] }),
    _react2['default'].createElement(_reactRouter.Route, { path: 'testpage', component: _appComponentsTestJsx2['default'] })
);

【问题讨论】：

标签： reactjs react-router

【解决方案1】：

由于某种原因，我不明白添加历史记录（当然我必须运行 npm install history）使问题消失：
entry.jsx

import createBrowserHistory from 'history/lib/createBrowserHistory';
ReactDOM.render(<Router history={createBrowserHistory()} routes={routes} />, document.getElementById('content'));

【讨论】：