0

React アプリを作成しようとしていますが、問題があります。メイン ページを読み込もうとすると、エラーは発生しませんが、ページには何も表示されません。

アプリのエントリ ポイントはmain.jsで、renderメソッドには次のものが含まれます。

React.render((
  <Router history={history}>
    <Route component={RootComponent}>
      <Route path="/page1" component={Page1}></Route>
      <Route path="/page2" component={Page2}></Route>
    </Route>
  </Router>
), document.body);

のrender方法はRootComponent.js次のようになります。

render() {
  return (
    <div className="navContainer">
      <Menu onMenuChange={::this._onMenuChange} ref="slidemenu" alignment="left">
        <MenuItem hash="/page1">Dash Board</MenuItem>
        <MenuItem hash="/page2">Create Deal</MenuItem>
      </Menu>
      <div className={this.state.expand ? 'slidebody' : 'shrinkbody'}>
        <span className="menuIcon" onClick={this.showLeft}>&#9776;</span>
        {this.props.children}
      </div>
    </div>
  );
  }

残りのコンポーネントは単純なコンポーネントです。前述したように、エラーはありませんが、アプリには何も表示されません。これは実際にブラウザーでレンダリングされるものです。

<body>
  <noscript data-reactid=".0"></noscript>
</body>

私は "react": "^0.13.3" と "react-router": "^1.0.0-beta3" を使用しています。

ページに何も表示されないのはなぜですか? どうすればこれを修正できますか?

4

1 に答える 1

0

RootComponent の Route へのパスを追加します。

React.render((
 <Router path="/" history={history}>
 <Route component={RootComponent}>
  <Route path="/page1" component={Page1}></Route>
  <Route path="/page2" component={Page2}></Route>
</Route>
</Router>
), document.body);
于 2016-08-17T13:45:50.017 に答える