全局组件(插件):就是指可以在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>