【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: ["value1", "value2"]
};
</script>

在main.js中声明全局组件

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

使用

<!--全局组件-->
<my-bread value1="权限管理" value2="权限列表"></my-bread>

局部组件：

components:{
login:{
template:`
<h1>这是一个局部的组件</h1>
`
}