VUE中自定义组件的挂载方式有哪些

发表于 2023-04-18 更新于 2023-06-01 分类于 vue 阅读次数： Changyan：本文字数： 697 阅读时长 ≈ 1 分钟

在VUE中，组件的挂载方式有很多种，我们可以通过组件的方式，全局混入，全局指令，全局过滤器，配置选项，扩展构造器等方式来挂载组件。

Vue.use()

这是推荐的挂载组件的方式。我们可以这样定义一个组件:

const myPlugin = {
  install(Vue) {
    // 添加组件、指令、过滤器等
  }
}

然后在使用组件时调用 Vue.use():

1	Vue.use(myPlugin)

添加一些选项到 Vue 全局:

1
2
3

Vue.mixin({
  // 添加选项
})

添加全局指令:

1
2
3

Vue.directive('my-directive'， {
  // 指令选项
})

添加全局过滤器:

1
2
3

Vue.filter('my-filter'， function (value) {
  // 过滤逻辑
})

传入某些配置到 Vue 构造器选项:

1	Vue.config.optionName = value

创建一个 Vue 的子类:

1
2
3

const ExtendedVue = Vue.extend({
  // 选项
})

然后就可以使用这个扩展的构造器 ExtendedVue 来创建 Vue 实例。

这些都是可以用于挂载组件的方式，改变或扩展 Vue 的全局/局部的行为。Vue.use() 是最推荐的方式，因为它遵循 Vue 组件的规范，并且可以在安装组件时执行依赖检查。