首页 文章

React路由器在根路由显示内容

提问于
浏览 次
0

我正在使用React路由器进行SPA，但我不确定如何在索引路由“/”上显示一些内容 .

我的顶级路由器配置只是：

<Route path="/" component={App}>
    // ...
</Route>

顶级组件呈现页眉/页脚和其他常见元素：

<nav>
    // ...
</nav>

{children}

<nav className="footer">
    // ...
</nav>

子路由工作正常，它们在App组件中呈现 . 但是，如何在根路径中呈现某些内容，这样它不仅仅是一个空白页面？

reactjs react-router

1 回答

  • 1

    假设您要为 <App> 中的根路由提供的内容是 <Home> ，下面是从guide react-route 引用的 .

    <Router>
  <Route path="/" component={App}>
    <IndexRoute component={Home}/>
    <Route path="accounts" component={Accounts}/>
    <Route path="statements" component={Statements}/>
  </Route>
</Router>

    这就是 <App> 的样子 .

    const App = React.createClass({
    render() {
        return {this.props.children || <Home/>};
    }
});
    回复于

相关问题