用默认插槽封装面包屑导航

在项目中常会用到elementUI提供的面包屑导航（也叫路径导航），但是在多个组件中都会使用到，此时需要封装成一个公用的组件，以便于在每个组件中用最简单的方式实现路径导航。

步骤：

1、定义一个面包屑组件

<template>
  <el-breadcrumb separator-class="el-icon-arrow-right">
          <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
          <el-breadcrumb-item>
              <!-- 使用默认插槽（只需要插入一处内容） -->
              <slot></slot>
          </el-breadcrumb-item>
        </el-breadcrumb>
</template>
<script>
export default {
  name: 'my-bread'			//组件名：便于在后面封装的js插件中，全局注册时使用组件名
}
</script>

2、在封装的js插件src/pulgin中全局注册

// 对vue进行一些扩展功能（全局注册-过滤器等）
import MyBread from '@/components/my-bread'

export default {
  install: (Vue) => {
    Vue.component(MyBread.name, MyBread)
  }
}

3、main.js中导入并使用封装的插件

import plugin from '@/plugin'
Vue.use(plugin) // 全局注册自己封装的vue插件（面包屑）

4、使用插槽

 <my-bread>超简单</my-bread>

如果vue中没有提供想要的插件，可以自己封装一个vue插件

对不同插槽的说明和使用