Vue.use() 和 Vue.component() 的区别

官方定义：

Vue.use( plugin )

• 参数：

  • {Object | Function} plugin

• 用法：

  安装 Vue.js 插件。如果插件是一个对象，必须提供 install 方法。如果插件是一个函数，它会被作为 install 方法。install 方法调用时，会将 Vue 作为参数传入。

  该方法需要在调用 new Vue() 之前被调用。

  当 install 方法被同一个插件多次调用，插件将只会被安装一次。

• 参考：插件

Vue.component( id, [definition] )

• 参数：

  • {string} id
  • {Function | Object} [definition]

• 用法：

  注册或获取全局组件。注册还会自动使用给定的 id 设置组件的名称

  // 注册组件，传入一个扩展过的构造器 Vue.component('my-component', Vue.extend({ /* ... */ })) // 注册组件，传入一个选项对象 (自动调用 Vue.extend) Vue.component('my-component', { /* ... */ }) // 获取注册的组件 (始终返回构造器) var MyComponent = Vue.component('my-component')

• 参考：组件

2、当我们想好多地方要是用到同一个组件，又不想每次都在局部注册时，可以在main.js 中全局注册

main.js

import common from '@/components/common.vue'

Vue.component(common);

3、Vue.use() 可以一次性注册多个组件或添加全局方法或属性

Vue.use(plugin)的初始化方法{install:function(){}}里面可以一次性注册多个组件。
Vue.component只能一个一个注册。
install可以做更多的事情
MyPlugin.install=function(Vue,options){
//1.添加全局方法或属性
Vue.myGlobalMethod=function(){
//逻辑...
}
//2.添加全局资源
Vue.directive('my-directive',{
bind(el,binding,vnode,oldVnode){
//逻辑...
}
...
})
//3.注入组件选项
Vue.mixin({
created:function(){
//逻辑...
}
...
})
//4.添加实例方法
Vue.prototype.$myMethod=function(methodOptions){
//逻辑...
}
}