全局混入在项目中怎么用?
在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选项】将被合并为同一个对象。两个对象键名冲突时,取组件对象的键值对。