我有一个SPA,它有2个标签,在其中呈现数据。 组件和相应的URL结构如下:
URL --> Component
/ --> PostContainer
/create --> MessageFormContainer
/update/:id --> MessageUpdatesContainer
/update/:id/infoCreate --> InfoCreateContainer
/update/:id/infoView/:id --> InfoViewContainer
如果我定义路由,每个路由都有自己的特定URL(样本1),那么路由器工作; 但是如果使用childRoutes来嵌套组件(示例2),则形成的URL将显示在URL栏中,但屏幕上不会显示任何内容。
样本1:
const AppRoutes = {
path: '/',
component: MainContainer,
indexRoute: { component: PostsContainer },
childRoutes: [{
path: 'create',
component: MessageFormContainer
},{
path: 'update/:id',
component: MessageUpdatesContainer,
},{
path: 'update/:id/infoCreate',
component: InfoCreateContainer
},{
path: 'update/:id/infoView/:id',
component: InfoViewContainer
}]
}
作品。
样本2:
const routes = {
path: '/',
component: MainContainer,
indexRoute: { component: PostsContainer },
childRoutes: [
{ path: 'create', component: MessageFormContainer },
{
path: 'update/:id',
component: MessageUpdatesContainer,
childRoutes: [{
path: 'infoCreate',
component: InfoCreateContainer
},{
path: '/infoView/:id',
component: InfoViewContainer
}]
}]
}
]
}
不行。 只有URL在URL栏中更新,但屏幕上没有任何内容呈现。 对示例2的组件所做的唯一更改是它们包含this.props.children tags
以容纳childRoute组件。
任何想法都会有所帮助......在此先感谢!