首页 文章

React-Router不呈现IndexRoute不包含AppRoute?

提问于
浏览
0

当使用react-router时,我遇到了一些问题,我的路由器没有渲染Layout组件,只渲染Index组件,这有什么问题?

我的源代码如下:

路由器:

<Router history={createHistory queryKey: false} onUpdate={-> window.scrollTo(0, 0)}>
<Route path="/" handler={Layout}>
  <IndexRoute component={Index}/>
  <Route path="movies" handler={Movies}>
    <Route path=":id" handler={Movies} />
  </Route>
  <Route path="books" handler={Books}>
    <Route path=":id" handler={Books} />
  </Route>
</Route>

布局:

React = require "react"
{Router} = require "react-router"
{AppCanvas, AppBar} = require("material-ui")
require "./layout.less"
Layout = React.createClass
  render: ->
    <AppCanvas>
      <AppBar title="Title" iconClassNameRight="muidocs-icon-navigation-expand-more" />
      <div class="content">
        {this.props.children}
      </div>
    </AppCanvas>
module.exports = Layout

指数:

React = require "react"
Index = React.createClass
  render: ->
    <h1>Welcome,Home</h1>
module.exports = Index

1 回答

  • 0

    看起来你的路线上混合了 handlercomponent 属性 . handler 已在最新版本的React Router中删除 .

    尝试:

    <Router history={createHistory queryKey: false} onUpdate={-> window.scrollTo(0, 0)}>
      <Route path="/" component={Layout}>
        <IndexRoute component={Index}/>
        <Route path="movies" component={Movies}>
          <Route path=":id" component={Movies} />
        </Route>
          <Route path="books" component={Books}>
          <Route path=":id" component={Books} />
        </Route>
      </Route>
    </Router>
    

相关问题