Vue教程14:配置子路由
chencl1986 opened this issue · 0 comments
chencl1986 commented
阅读更多系列文章请访问我的GitHub博客,示例代码请访问这里。
添加子路由
在/src/components/news.js文件中配置子路由,之后将子路由配置赋值给'/news'路由的children属性中。
编译后访问路径'/news/1'可以看到效果。
子路由配置:
代码示例:/lesson14/src/components/news.js
export const router = [
{
path: '1',
name: 'news1',
components: {
news_header: NewsHeader,
default: News1
}
},
{
path: '2',
name: 'news2',
components: {
news_header: NewsHeader,
default: News2
}
}
]
将配置赋值给children属性:
代码示例:/lesson14/src/router.js
import News, { router as news_router } from './components/news';
export default new VueRouter({
routes: [
{
path: '/news',
name: 'news',
components: {
header: Header,
default: News
},
children: news_router
}
]
})