【VUE】自定义全局组件

首先在自己的项目路径的组件目录components下创建pagination文件夹,我已分页组件为例,pagination文件夹下有两个文件index.js、pagination.vue。

index.js

import pagination from './pagination.vue'

const Pagination = {
    install(Vue) {
        Vue.component('Pagination',pagination)
    }
}

// 导出组件
export default Pagination

pagination.vue

// 只复制了部分代码

在main.js中引入

import Vue from 'vue';
import App from '@/App';

/* ==================
  Pagination组件引入
 ==================== */
import Pagination from '@/components/pagination/index';
Vue.use(Pagination);

new Vue({
    el: '#app',
    render: h => h(App)
})

在main.js中引入后,就可以在其他页面中使用,比如在App.Vue页面使用


你可能感兴趣的:(【VUE】自定义全局组件)