mixin合并策略

含义：

        mixin是一种Vue组件选项，它允许我们定义一些可重用的组件选项，并在多个组件中进行混合。这是一个强大的工具，特别适用于在不同组件之间共享相似的逻辑。

使用场景：

1. 共享通用逻辑：当多个组件需要共享相同的方法、数据或计算属性时，使用mixin是一个不错的选择。例如，你可以创建一个mixin来处理表单验证或动画效果，然后在多个组件中混合使用它。
2. 增强组件：你可以使用mixin来增强已有的组件，而不必修改它们的源代码。这对于第三方组件或库的定制非常有用。

与extends的不同：

        是另一种Vue组件选项，它允许你创建一个新组件，该组件继承另一个组件的所有选项。

• 创建新组件：当你想要基于一个现有组件创建一个新组件，并且希望新组件继承原始组件的所有选项时，使用extends是一个很好的选择。这可以帮助你避免重复编写相似的代码。

• 覆盖特定选项：如果你需要对继承的组件进行一些特定的更改，例如修改数据属性或方法，你可以使用extends并在新组件中重新定义这些选项，以覆盖原始组件的定义。

mixin合并策略有一些细节需要注意： 

1. 当组件和mixin含有同名选项时，这些选项将以恰当的方式在Vue.extend()里最终选择使用相同的选项合并逻辑合并，并在发生冲突时以组件数据优先。
2. 对于钩子函数，mixin中的钩子将在组件自身钩子之前调用。
3. mixin和组件中存在相同方法时，组件的方法优先级大于mixin中，也就是说，mixin中的方法会被组件中的方法覆盖掉，不执行。
4. 多个组件调用同一个mixin时，每个变量都是单独独立的，不会影响其他组件。
5. 使用mixin时要注意避免全局混入，因为这会影响每个单独创建的Vue实例（包括第三方组件）。

具体合并策略如下：

1. data： mixins中的data会合并到data中，有冲突的话，data中数据覆盖mixins中的数据。全局存在的话，全局的权重最低。
   组件 -> mixin -> mixin-mixin -> 全局 mixin
2. provide：与data一致。
   组件 -> mixin -> mixin-mixin -> 全局 mixin
3. 钩子函数： mixins中的钩子函数也会执行，先执行mixins中的钩子函数。全局存在的话，全局的权重最高。
   全局 mixin -> mixin-mixin -> mixin -> 组件
4. component、directives、filters： 有冲突时，组件component、directives、filters会覆盖mixins中的。他们是通过原型链的方式不会相互覆盖，而是 权重小 被放到 权重大 的原型上
   组件 -> mixin -> mixin-mixin -> 全局 mixin
5. watch：与钩子函数一致。
   全局 mixin -> mixin-mixin -> mixin -> 组件
6. props、computed、methods、inject：简单的对象合并，key 值相同，优先级高的覆盖优先级低的。
   组件 -> mixin -> mixin-mixin -> 全局 mixin

7. el、template、propData：组件 -> mixin -> mixin-mixin -> 全局 mixin

混入的方式：

• 函数叠加混入（data、provide）
• 数组叠加混入（hook、watch）
• 原型链叠加混入（components，filters，directives）
• 对象覆盖混入（props，methods，computed，inject ）
• 替换覆盖混入（el，template，propData）

优点：

• 提高代码复用性
• 无需传递状态
• 维护方便，只需要修改一个地方即可

 缺点：

• 命名冲突
• 滥用的话后期很难维护
• 不好追溯源，排查问题稍显麻烦
• 不能轻易的重复代码