vue + element-UI 实现面包屑

1. 路由文件中配置

 // router.js
import Vue from 'vue'
import Router from 'vue-router'
Vue.use(Router)

const Login = () => (import('@/components/Login'))
const Home = () => (import('@/components/Home/index'))

const router = new Router({
  routes: [
    {
      path: "/",
      name: "首页",
      redirect: '/home'
    },
{
      path: '/home',
      component: Home,
      meta: { requiresAuth: true },
      children: [
        {
          path: '/',
          redirect: './overview'
        },
        { path: '/home/overview', name: "系统总览", component: Overview, meta: { title: '系统总览' } },  // 配置meta
        { path: '/home/nodeTree/tree', name: "菜单管理", component: nodeTree, meta: { title: '菜单管理' } },  // 配置meta
        { path: '/home/water/all', name: "水厂监测", component: WaterallPage, meta: { title: '水厂监测' } }  // 配置meta
    {
      path: '/login',
      name: 'Login',
      component: Login
    },
    { path: '*', component: NotFoundComponent }
  ],
  linkActiveClass: "active-router",
  linkExactActiveClass: "exact-router"
})
export default router

2. 组件内容