Vue自定义全局组件(插件)

1. 全局组件: 就是指可以在main.js中使用Vue.use()进行全局引入,然后在其他组件中就可以使用了

import VueRouter from "vue-router"
Vue.use(VueRouter)

1. 普通组件: 每次使用时都要引入

---

如何自定义全局组件

1. 首先写一个组件
2. 然后写一个引入文件

// index.js

import componentName from "./src/componentName.vue"

export default {
    install: (Vue) => {
        Vue.component("exportComponentName",componentName)
    }
}

1. 然后在main.js中就可以这么写了

imoprt exportComponentName from "./component/index.js"

Vue.use(exportComponentName)

1. 以后就可以直接使用了

---

如何要添加全局方法,那么可以在Vue.propotype上添加

直接在index.js上书写

export default {
    install: (vue) => {
        Vue.prototype.actionName = (arguments) => {
            // code
        }

        Vue.prototype.actionName2 = (arguments) => {
            // code
        }

        Vue.prototype.actionName3 = (arguments) => {
            // code
        }

        Vue.prototype.actionName4 = (arguments) => {
            // code
        }
    }
}