深入了解Vue之Mixin

1、与vuex的区别

vuex：用来做状态管理的，里面定义的变量在每个组件中均可以使用和修改，在任一组件中修改此变量的值之后，其他组件中此变量的值也会随之修改。

Mixins：可以定义共用的变量，在每个组件中使用，引入组件中之后，各个变量是相互独立的，值的修改在组件中不会相互影响。

2、与公共组件的区别

组件：在父组件中引入组件，相当于在父组件中给出一片独立的空间供子组件使用，然后根据props来传值，但本质上两者是相对独立的。

Mixins：则是在引入组件之后与组件中的对象和方法进行合并，相当于扩展了父组件的对象与方法，可以理解为形成了一个新的组件。

要注意的知识点：

（1）当全局引入mixin时使用的是Vue.mixin(mixin);而单文件引入时使用的是mixins:[mixin]，有一个”s“的差别，别忘记写。

（2）当混合里面包含异步请求函数，而我们又需要在组件中使用异步请求函数的返回值时，我们会取不到此返回值，解决方案：不要返回结果而是直接返回异步函数

错误案例：

错误案例

正确案例:

正确案例

（3）如果组件和基类对象（Mixin）含有同名选项时：

钩子函数： 混合为一个数组 ，基类对象（Mixin）的钩子将在组件自身钩子之前调用

值为对象的选项： 如 methods, components 和 directives，将被混合为同一个对象。 两个 对象键名冲突时，取组件对象的键值对。