React Router即使在设置完成后也始终没有路由

时间:2016-06-01 02:49:51

标签: javascript meteor reactjs react-router

我刚开始使用Meteor和React,我见过的大多数路由器都指向了路由器。我从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'));
});

对此有任何帮助将不胜感激!已经停留了一段时间,希望能够继续前进。

1 个答案:

答案 0 :(得分:0)

看起来您已将Home声明为您的应用程序布局,然后您将使用以下路径:

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