vue注册全局组件

在component文件夹中，
新建文件夹(cuscom)
然后新建文件(myBread.vue)

在myBread.vue文件如下

 <template>
        <el-breadcrumb separator="/">
            <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
            <el-breadcrumb-item>
              <a href="/">{{value1}}</a>
            </el-breadcrumb-item>
            <el-breadcrumb-item>{{value2}}</el-breadcrumb-item>
        </el-breadcrumb>
    </template>

    <script>
        // 自定义组件  面包屑
        export default {
        name: "my-bread", //给组件起一个名字
        data() {
            return {};
        },
        // props外界来的数据
        // props值是字符串数组
        // props中的数据的值，来源于使用组件时 传递的值
         props: ["value1", "value2"]
    };
    </script>

2==>在main.js中导入组件  在main.js 组件 注册

import MyBread from "@/components/cuscom/myBread.vue";
Vue.component("my-bread", MyBread); //注册组件

3==>在某个文件中使用
<my-bread value1="权限管理" value2="权限列表"></my-bread>

全局组件直接在谋而页面使用就可以了。
不需要在使用的页面上注册哈
因为它在main.js中注册在vue上面去了。随意可以直接使用。

其实还可以将上面的组件 进行优化一下的

其他不变，在mian.js中注册时，这样写更好一些的

组件的名字应该是写组件的人提供的
// MyBread是一个对象
import MyBread from "@/components/cuscom/myBread.vue";
Vue.component(MyBread.name, MyBread); //注册组件

使用时还是不变

 <my-bread value1="权限管理" value2="权限列表"></my-bread>