vue2创建根结点时,data的处理

89 阅读1分钟

1、进入到Vue构造函数
2、初始化_init()创建一个初始vue实例vm,之后创建$option对象 将vue实例的option和vm,以及根组件传进来的option进行合并

vm.$options = mergeOptions(resolveConstructorOptions(vm.constructor), options || {}, vm);

3、在mergeField('data')的时候调用了strats.data(),之后转到mergeDataOrFn(parentVal, childVal, vm)方法,再到mergedInstanceDataFn()方法,最后返回了mergeData()

总之,strats.data()之后,data变成了mergedInstanceDataFn()
此方法将父元素的defaultData和当前元素的instanceData合并到了instanceData

总结:根组件的data在创建的时候,变成了一个方法,这个方法将返回父组件(这里的父组件是基础vm实例)和子组件data的合并结果