VUE+elementui面包屑实现动态路由详解

我的路由：

const routerMap = [
  {
    path: '/',
    redirect: 'dashboard',
    component: Layout,
    name:'Dashboard',
    children: [
      {
 path: 'dashboard',
 component: () => import('@/view/dashboard'),
 name: 'Dashboard',
 meta: { title: 'dashboard', icon: 'dashboard', noCache: true }
      }
    ]
  },{
    path:'/test',
    component:Layout,
    redirect: '/test/index',
    name:'Test',
    meta:{title:'test',icon:'lock'},
    children:[
      {
 path:'index',
 component:()=>import('@/view/test'),
 name:'test',
 meta:{title:'test', icon: 'example', noCache: true }
      },{
 path:'example',
 component:()=>import('@/view/test/example'),
 name:'example',
 meta:{title:'example',icon:'404'}
      }
    ]
  }
]

面包屑代码：

原理：通过监听当前路由的变化，动态更新面包屑的内容。

以上这篇VUE+elementui面包屑实现动态路由详解就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持考高分网。