vue2 mixin

 文档

【基础】混合是一种灵活的分布式复用 Vue 组件的方式。混合对象可以包含任意组件选项。以组件使用混合对象时，所有混合对象的选项将被混入该组件本身的选项。

【选项合并】 当组件和混合对象含有同名选项时，这些选项将以恰当的方式混合。比如，同名钩子函数将混合为一个数组，因此都将被调用。另外，混合对象的钩子将在组件自身钩子之前调用。

值为对象的选项，例如methods、components和directives，将被合并为同一个对象。两个对象键名冲突时，取组件对象的键值对。注意：Vue.extend()也使用同样的策略进行合并。

【全局混入】混入也可以进行全局注册。使用时格外小心！一旦使用全局混入，它将影响每一个之后创建的 Vue 实例。使用恰当时，这可以用来为自定义选项注入处理逻辑。

//1.创建共同方法的JS文件(MixinMethod.js)
export default {
  methods: {
    comMethod1: function ( ) {
      console.log('共同方法1');
    },
    comMethod2: function ( ) {
      console.log('共同方法2');
    },
    comMethod3: function ( ) {
      console.log('共同方法3');
    }
  }
}

//2.在vue中引入，并实现
import MixMethod from "../mixin/MixinMethod";
export default {
  name: 'test',
  mixins: [ MixMethod ],
  data(){},
  methods: {
    console.log(this.comMethod1());
    console.log(this.comMethod2());
    console.log(this.comMethod3());
  },
}