在項目中肯定有這樣的需求，那就是在某個頁面的時候，頂部展示 現在當前的頁面路徑，如下圖：

這個在vue中其實很好實現。

首先出現這個肯定是相對應不同的頁面，也就是說對應不同的路由，我們在定義路由的時候：如下

routes: [
        {
            path: ‘/‘,
            name: ‘login‘,
            component: login
        },{
            path: ‘/Page‘,
            name: ‘Page‘,
            component: Page,
            children: [
                {
                    path: 
 
‘/‘,
                    name: ‘Chart‘,
                    component: Chart,
                    meta: []
                },{
                    path: ‘/UserList‘,
                    name: ‘UserList‘,
                    component: UserList,
                    meta: [‘數據列表‘, ‘用戶列表‘],
                },{
                    path: 
 
‘/OrderList‘,
                    name: ‘OrderList‘,
                    component: OrderList,
                    meta: [‘數據列表‘, ‘訂單列表‘]
                },{
                    path: ‘/addShop‘,
                    name: ‘addShop‘,
                    component: addShop,
                    meta: [‘添加數據
 
‘, ‘添加商品‘]
                }
            ]
        }
    ]

其次在 當前需要展示頁面路徑的地方：

<el-breadcrumb-item v-for="(item, index) in $route.meta" key="index">{{item}}</el-breadcrumb-item>

我們便可以拿到當前頁面的路徑。

vue路由中的 Meta