vue 中麪包屑帶跳轉的做法

首先要在子頁面的meta中定義

{
   path: '/staffsManagement',
     component: () => import(/* webpackChunkName: "dashboard" */ '../components/page/systemSetting/staffsManagement/index.vue'),
     meta: [{ name: '員工管理' }],
 },
 {
     path: '/staffsManagement/addedstaff',
     component: () => import(/* webpackChunkName: "dashboard" */ '../components/page/systemSetting/staffsManagement/addedstaff.vue'),
     meta: [{ name: '員工管理' ,url:'/staffsManagement'},//子頁面的meta中要攜帶父頁面的名稱以及路徑
         {name:'新建員工'}
     ],
 },

下來 設置麪包屑

<el-breadcrumb separator="/" style="margin:20px">
    <el-breadcrumb-item :to="{path:'/'}">首頁</el-breadcrumb-item>
    <el-breadcrumb-item v-for="(item,index) in this.$route.meta" :key="index" :to="item.url">
        <router-link v-if="item.url" :to="item.url">{{item.name}}</router-link>
        <a v-else>
            {{item.name}}
        </a>
    </el-breadcrumb-item>
</el-breadcrumb>