混合

1.合并

一种分发Vue组件中可复用功能的方式

var mixin = {
    //同名钩子合并为一个数组，依次调用
    created: function () {
        console.log('混合对象的钩子被调用');
    },
    //methods, components, directives同名函数合并，取组件对象中的键值对
    methods: {
        confliction: function () {
            console.log('混合对象');
        }
    }
};

//输出:
//混合对象的钩子被调用
//组件钩子调用
var app = new Vue({
    mixins: [mixin],
    created: function () {
        console.log('组件钩子调用');
    },
    methods: {
        confliction: function () {
            console.log('组件对象');
        }
    }
});

//输出:组件对象
app.confliction();

Vue.extend()合并策略相同

2.全局混合

//输出:66
Vue.mixin({
    created: function () {
        console.log(this.$options.name);
    }
});

new Vue({
    name: "66"
});

谨慎使用全局混合对象，会影响每个单独创建的Vue实例

3.自定义选项合并策略

使用Vue.config.optionMergeStrategies添加，自定义合并策略