Question

我已经阅读了同样问题的所有其他问题，但它对我来说并不起作用。

的index.html

<body>
  <h1>Index</h1>
  <div id="app"></div>
</body>

的客户机/ app.jsx

import React from 'react';
import { render } from 'react-dom';
import { Router, Route, IndexRoute, browserHistory } from 'react-router';
import { Accounts, STATES } from 'meteor/std:accounts-ui';

import { MainLayout } from '../imports/ui/layouts/main.jsx';

import { IndexPage } from '../imports/ui/components/index.jsx';
import { NotFoundPage } from '../imports/ui/components/errors/not-found.jsx';

Meteor.startup( () => {
  render(
    <Router history={ browserHistory }>
      <Route path="/" component={ MainLayout }>
        <IndexRoute component={ IndexPage } />
        <Route path="signin" component={ Accounts.ui.LoginForm } formState={ STATES.SIGN_IN } />
        <Route path="signup" component={ Accounts.ui.LoginForm } formState={ STATES.SIGN_UP } />
      </Route>
      <Route path="*" component={ NotFoundPage } />
    </Router>,
    document.getElementById('app')
  );
});

进口/ UI /布局/ main.jsx

import { Component } from 'react';

export default class MainLayout extends Component {
  render() {
    return (
      <div>
        <h2>Main Layout</h2>

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

进口/ UI /组件/ index.jsx

import { Component } from 'react';

export default class IndexPage extends Component {
  render() {
    return (
      <div>Index Page</div>
    );
  }
}

进口/ UI /组件/错误/未found.jsx

import { Component } from 'react';

export default class NotFoundPage extends Component {
  render() {
    return (
      <div>404 - Not found!</div>
    );
  }
}

因此，转到除<{1}}或/signin之外的任何网址除了/signup中的内容之外没有显示任何内容（即反应不会呈现任何东西）

此外，index.html根本不会呈现/signin。

我试过环顾四周，重新阅读文档等等。我的代码没有看错，也没有任何错误。那么，为什么它不起作用呢？

（注意：我有Meteor 1.3.2.4，昨天安装了所有最新的npm模块和软件包。）

Answer 1

好吧，我走到外面走了（它终于阳光明媚，温暖了！）然后回来了。我在代码与示例here之间看到的唯一区别是export语句...或export default更精确。

从

改变

import { MainLayout } from '../imports/ui/layouts/main.jsx';

到

import MainLayout from '../imports/ui/layouts/main.jsx';

是我的错误。

React Router不显示我的组件

的index.html

的客户机/ app.jsx

进口/ UI /布局/ main.jsx

进口/ UI /组件/ index.jsx

进口/ UI /组件/错误/未found.jsx

1 个答案: