在React Router中,我有一个嵌套的路由。
<Route path='about' component={{main: About, header: Header}}>
<Route path='team' component={Team} />
</Route>
现在当我访问/about/team
时,它显示团队。
但是我该如何设置在访问/about
时看到哪个组件?
我已经尝试过
<Route path='about' component={{main: About, header: Header}}>
<IndexRoute component={AboutIndex} />
<Route path='team' component={Team} />
</Route>
并且
<Route path='about' component={{main: About, header: Header}}>
<Route path='/' component={AboutIndex} />
<Route path='team' component={Team} />
</Route>
但它不能正常工作。
我的About组件长这样
class About extends React.Component {
render () {
return (
<div>
<div className='row'>
<div className='col-md-9'>
{this.props.children}
</div>
<div className='col-md-3'>
<ul className='nav nav-pills nav-stacked'>
<li className='nav-item'><IndexLink className='nav-link' to='/about' activeClassName='active'>About</IndexLink></li>
<li className='nav-item'><Link className='nav-link' to='/about/team'>Team</Link></li>
</ul>
</div>
</div>
</div>
);
}
}
IndexRoute
? - jayarjo