vue-mixin

全局混入在项目中怎么用?

在main.js中写入

    import Vue from 'vue';
    import mixins from './mixins';
    Vue.mixin(mixins);
复制代码

之后，全局混入可以写在mixins文件夹中index.js中，全局混入会影响到每一个之后创建的 Vue 实例（组件）；

局部混入在项目中怎么用

局部混入的注册，在mixins文件中创建一个a_mixin.js文件，然后再a.vue文件中写入

<script>
    import aMixin from 'mixins/a_mixin'
    export default{
        mixins:[aMixin],
    }
</script>
复制代码

局部混入只会影响a.vue文件中创建的Vue实例，不会影响到其子组件创建的Vue实例；

组件的选项和混入的选项是怎么合并的

• 数据对象【data选项】，在内部进行递归合并，并在发生冲突时以组件数据优先；
• 同名钩子函数将合并为一个数组，因此都将被调用。另外，混入对象的钩子将在组件自身钩子之前调用；
• watch对象合并时，相同的key合成一个对象，且混入监听在组件监听之前调用；
• 值为对象的选项【filters选项、computed选项、methods选项、components选项、directives选项】将被合并为同一个对象。两个对象键名冲突时，取组件对象的键值对。