通用后台管理系统前端界面Ⅷ——公用组件之面包屑

新建共用组件Breadcrumb.vue，从element-ui官网找组件 导入面包屑到Home.vue显示使用

 实时显示：

Breadcrumb.vue 

<template>
  <div>
    <el-card>
      <el-breadcrumb separator-class="el-icon-arrow-right">
        <el-breadcrumb-item :to="{ path: '/home' }">首页el-breadcrumb-item>
        <el-breadcrumb-item
        v-for="(item,index) in $route.matched"
        :key="index"
        >{{item.name}}
        el-breadcrumb-item>
      el-breadcrumb>
    el-card>
  div>
template>
 
<script>
export default {};
script>
 
<style>style>