- 当需要在同一层级下同时展示多个视图时,需要添加新的
router-view
并新增name
属性指定名字,然后在路由配置项需要同级展示的路由中添加新的路由组件,defaule
表示默认路由组件,将通过没有添加的router-view
标签进行展示
app.js
<template>
<div id="app">
<router-view name="hobby"></router-view>
<router-view name="abc"></router-view>
<router-view class="center"></router-view>
</div>
</template>
router文件
{
path: '/document',
name: 'document',
components: {
default: document,
hobby: hobby,
abc: abc
}
}