面包breadcrumb中配置路由

面包屑中配置vue router的方法如下

template代码

 <el-breadcrumb separator="/">
              <el-breadcrumb-item :to="{ path:'/controller' }">首页 </el-breadcrumb-item>
              <el-breadcrumb-item v-if="type ==1" >BMT </el-breadcrumb-item>
              <el-breadcrumb-item v-for="item,index in breads" :key="index" v-if="index!==0">{{item.name}}</el-breadcrumb-item>
</el-breadcrumb>

js代码

 getBreadcrumb(){
          this.breads=[];
          console.log(this.$route.matched);
          this.$route.matched.forEach((item,index)=>{
              this.breads.push({
                  name:item.meta.title,
                  path:item.path
              })
              this.type =item.meta.type
          })
      }
    },
    mounted(){
      this.getBreadcrumb();
    },
    watch: {
       $route(){
         this.getBreadcrumb();
       }
    }

route代码

import Vue from 'vue'
import Router from 'vue-router'

Vue.use(Router)

export default new Router({
  routes: [
    {
      path: '/',
      name: 'login',
      component: resolve => require(['@/views/login'],resolve),

    },
    {
      path: '/controller',
      name: 'controller',
      meta: { requiresAuth: true,},
      component: resolve => require(['@/views/controller'],resolve),
      children:[
        {
          path:'/controller/bmtManage',
          name:'bmtManage',
          component: resolve => require(['@/views/controller/bmtManage'], resolve),
          meta: { title: '管理',type:1 }
        },
        {
          path:'/controller/bmtRegister',
          name:'bmtRegister',
          component: resolve => require(['@/views/controller/bmtRegister'], resolve),
          meta: { title: '注册',type:1  }
        },
        {
          path:'/controller/bmtTem',
          name:'bmtTem',
          component: resolve => require(['@/views/controller/bmtTem'], resolve),
          meta: { title: '上传模板',type:1 }
        },
        {
          path:'/controller/userManage',
          name:'userManage',
          component: resolve => require(['@/views/controller/userManage'], resolve),
          meta: { title: '用户管理',type:0 }
        },
      ]
    },

  ]
})