当多个组件复用时候,可以考虑使用混入【mixin】简化代码,更好阅读和后期维护
vue 官方解释 混入 (mixin) 提供了一种非常灵活的方式,来分发 Vue 组件中的可复用功能。一个混入对象可以包含任意组件选项。当组件使用混入对象时,所有混入对象的选项将被“混合”进入该组件本身的选项
我们写项目比较常用到的格式化数字,如果格式化数字是几个组件比较通用的,可以抽出放在mixin
里面
mixin 实质上就是一个 vue 页面,写法和 vue 一致。当组件和混入对象含有同名选项时,这些选项将以恰当的方式进行“合并”,默认在发生冲突时以组件数据优先。也就是说调用 mixin 调用 mixin 的 data,组件本身也定义了同名的 data,最后打印出来效果是组件的 data。
以上可见:
- 混入对象的钩子将在组件自身钩子之前调用
- 同名的钩子函数会合并一起