React Router 总是说没有路由，即使它们已经设置好

Question

我刚刚开始使用 Meteor 和 React，我所看到的关于路由器的大部分内容都指向 react-router。我从 simple-todos 分支中提取了一些代码并设置了 "/" 路由，但不断收到错误 router.js:347 There is no route for the path: /。该页面显示了内容，但我不明白为什么会显示此错误。我试过用谷歌搜索答案，但找不到任何东西可以帮助我解决这个问题。我还尝试创建 <Link /> 元素以让链接将我发送到其他页面，但这也不起作用。

这是我的代码：

Routes.jsx

import React from 'react';
import { Router, Route, browserHistory, IndexRoute } from 'react-router';
import { render } from 'react-dom';


import Home from '../../ui/layouts/Home.jsx';
import SignUpPage from '../../ui/pages/SignUpPage.jsx';

export const renderRoutes = () => (
  <Router history={browserHistory}>
    <Route path="/" component={Home} />
  </Router>
);

Home.jsx

import React, { Component, PropTypes } from 'react';
import ReactDOM from 'react-dom';
import { Meteor } from 'meteor/meteor';
import { RouteHandler } from 'react-router';

import NavBase from '../components/nav/NavBase.jsx';
import Splash from '../components/home/Splash.jsx';
import Snapshot from '../components/home/Snapshot.jsx';
import FooterCTA from '../components/home/FooterCTA.jsx';
import JoinModal from '../components/accounts/JoinModal.jsx';
import LogInModal from '../components/accounts/LogInModal.jsx';

import '../stylesheets/bootstrap.min.css';
import '../stylesheets/style.css';

export default class Home extends Component {
  render() {
    return (
      <div>

        <NavBase />
        <Splash />
        <Snapshot />
        <FooterCTA />
        <LogInModal />

        {this.props.children}

      </div>
    )
  }
}

Home.propTypes = {
  currentUser: React.PropTypes.object,
  children: React.PropTypes.element,
};

main.jsx

import { Meteor } from 'meteor/meteor';
import { render } from 'react-dom';
import { renderRoutes } from '../imports/startup/client/routes.jsx';

Meteor.startup(() => {
  render(renderRoutes(), document.getElementById('app'));
});

对此的任何帮助将不胜感激！卡住了一段时间，希望能够继续前进。

Answer 1

看起来您已将 Home 声明为您的 App 布局，那么您的路线将如下所示：

<Router history={browserHistory}>
  <Route path="/" component={App}>
    <IndexRoute component={Home}/>
    <Route path="/another" component={Another}/>
  </Route>
</Router>