Vue Mixins 用久了为什么容易乱：复用逻辑不等于把代码拼在一起

Vue 里做逻辑复用时，Mixins 是很自然会接触到的一种方式。

刚开始用时它很顺手：提一段公共逻辑，多个组件混进来就能复用。可一旦项目做久，很多团队都会感受到同一个问题：Mixin 好写，但不太好管。

Mixin 最大的问题是“隐式”

组件引入一个 Mixin 后，表面上只是多了一行配置，实际上它可能带来：

• data
• methods
• computed
• 生命周期

这些能力会直接混进当前组件里。

功能上当然成立，但阅读代码的人很容易看不出来某个字段到底来自哪里。

一开始省事，后面成本会上来

Mixin 常常在项目前期特别讨喜，因为它能很快解决：

• 表单通用逻辑
• 列表加载逻辑
• 权限判断逻辑

可随着 Mixin 越来越多，组件就开始出现两个典型问题：

• 命名冲突
• 来源不清

这时调试体验会明显变差。

复用逻辑不能只看“抽没抽出来”

真正稳定的复用，不只是把代码搬到另一个文件，而是要让依赖关系仍然清楚。

如果一个组件用了多个 Mixin，后面想知道：

• 哪个方法是谁提供的
• 哪个生命周期里做了什么
• 为什么这个字段会突然存在

这些问题都会变得不那么直观。

写在最后

Mixin 当然能用，但它更适合短期、简单、边界清楚的逻辑复用。

一旦项目越来越复杂，光“能复用”已经不够，来源和边界同样重要。代码复用如果把可读性搭进去，后面通常会还回来更多维护成本。