自定义插件（全局组件）

一、简介

1、全局组件（插件）

全局插件（又叫全局组件），是指可以在main.js中使用Vue.use()进行引入的插件，在其他组件中都可以使用。如：vue-router，在main.js中的写法如下：

import VueRouter from 'vue-router'　　//引入全局组件（插件） 
Vue.use(VueRouter );    //使用全局组件

2、普通组件（插件）

每次使用的时候都要引入，如axios

import axios from 'axios'       //引入普通组件（插件）

 

二、自定义插件

1、初始化一个项目

运行 vue init webpack-simple component-demo

运行cd component-demo

运行 cnpm install

2、在src文件夹下创建文件夹components，用来存放自定义组件。在components文件夹下新建文件夹user存放用户相关组件，在user文件夹下新建自定义组件（插件）取名为Login.vue，并在Login.vue文件中写相应代码。

 

 3、在user文件夹中创建js文件，命名为index.js。在index.js中：引入组件Login.vue 并导出

 

 4、在main.js中引入自定义组件

 

5、在App.vue中使用组件

 

6、运行npm run dev查看页面效果。

自动打开浏览器的显示效果