vue中面包屑的动态数据步骤

第一步

在路由文件index.js添加meta

{
        path: '/index',
        name: 'index',
        meta: { title: '首页' },
        component: () => import( '../views/home/index/index.vue')
      }

第二步

获取数据

1.return里

return {
      lists: [],
    };

2.获取路由数据信息

 mounted() {
    this.lists = this.$route.matched;
  },

3.在el-breadcrumb-item添加v-for="item in lists" :key="item.path"

 <el-breadcrumb-item v-for="item in lists" :key="item.path">{{item.meta.title}}</el-breadcrumb-item>

4.添加监听watch

 watch: {
    $route(to, from) {
      this.lists = this.$route.matched;
    },
  },