要实现子组件之间的跳转,必须有一个公共的router-view父组件
父组件:router-view转换的场所,展示子组件外的共有内容,不是具体页面,所以不要加name属性
父组件(写成通用的公共组件):
<template>
<div>
<router-view :key="key" />
</div>
</template>
<script>
export default {
name: 'AppRouter',
computed: {
key() {
return this.$route.path
}
}
}
</script>
router.js
{
path: '/JieKouLB',
component: AppRouter,
meta: { title: '接口列表' },
// 父组件只是router-view转换的场所,展示子组件外的共有内容,不是具体页面,所以不要加name属性
children: [{
path: '/JieKouLB',
component: JieKouLB,
name: 'JieKouLB',
meta: { title: '' },
},
{
path: 'JieKouMC',
component: JieKouMC,
name: 'JieKouMC',
meta: { title: '接口名称' },
}]
},