VUE-7-2 自定义全局组件（插件）

全局组件（插件）：就是指可以在main.js中使用Vue.use()进行全局引入，然后在其他组件中就都可以使用了，如vue-router.element-UI

    import VueRouter from 'vue-router'
    Vue.use(VueRouter);

普通组件（插件）：每次使用时都要引入，如axios
    import axios from 'axios'

 

步骤：

①首先新建一个compontents文件夹，在里面新建一个文件夹，然后新建vue组件，然后在同级目录下，新建一个index.js文件

结构如图：

②在index.js里面输入，导入组件，然后导出install，目的是为了能够全局使用

 import login from './login.vue'

 export default {
   install: function (Vue) {
     Vue.component('Login', login);
   }
 };

③在main.js里面导入，也可以是user/index.js

import Login from './assets/components/user'

全局引用

Vue.use(Login);

④在App.vue组件中的模板写入，即可展示。

<Login></Login>