从源码看 Vue 中的 Mixin

最近在做项目的时候碰到了一个奇怪的问题,通过 Vue.mixin 方法注入到 Vue 实例的一个方法不起作用了,后来经过仔细排查发现这个实例自己实现了一个同名方法,导致了 Vue.mixin 注入方法的失效。后来查阅资料发现 Vue.mixin 注入到实例的 methods 方法会被实例中的同名方法替换,而不会依次执行。于是我就有了查看源码的想法,进而诞生了这篇文章~

本文所用源码版本为 2.2.6

首先从 Vue.mixin 这个方法入手,打开 src 目录不难找到 mixin 所在的文件:src/core/global-api/mixin.js,其内容如下: