深入Vue源码实战

我们学习了Vue源码肯定要运用于实际业务工作中

为了学习源码而没有实际的业务产出-我觉得是没有什么软用的

抛砖引玉

在最近的实际业务当中-因为项目语言要国际化
我们使用i8n插件作为语言国际化 我们在一开始实例化Vue的时候传递进去i8n的配置即可

new Vue({ i18n }).$mount('#app')

问题

但是又很多高阶组件我们是自己通过new Vue实例化之后使用$mount挂载到el上面
这部分组件并不是一开始new Vue的时候在main.js实例化的

Vue.prototype._init

通过查看Vue源码我们可以知道这个_init方法
是拿到Vue实例化里面的options对相关methods props data等属性进行初始化

思路

我们可以参照Vue源码复写数组方法达到响应式的思路，依样画葫芦。

const hdInit = Vue.prototype._init
Vue.prototype._init = function(args) {
  hdInit.call(this, {
    ...args,
    i18n,
  })
}

这样每次执行new Vue实例化的时候我们都会带上i8n的配置参数