我们在
data
中定义的
message
为什么可以在其他地方通过
this
访问到,实际上初始化的时候执行了
initState
方法,这个方法做了什么呢?
如果定义了
props
就初始化
props
,如果定义了
methods
就初始化
methods
,如果定义了
data
就调用
initData
初始化
data
initData
方法中,从
$options.data
中拿到拿到定义的
data
对象,之后判断这个对象是不是一个function,通过我们推荐
data
是一个函数return一个对象,如果
data
是一个函数就调用
getData
方法
里面返回了
data.call()
方法的调用,就是
data
中return的对象,除了赋值给
data
之外,还赋值给了
vm._data
如果判断
data
不是一个函数就报一个警告
data functions should return an object
接下来就拿到
data
的
key
值和
prop
以及
methods
的值,做一个对比。比如说如果在
data
中定义了
message
这个变量,那么接下来就不能在
prop
和
methods
中定义这个变量,因为他们最终都挂载到vm上,也就是this,是Vue。这个主要是通过
proxy(vm, '_data' , key)
来实现的,
proxy
是一层代理
通过
sharedPropertyDefinition
对象定义的
get
和
set
这两个函数和
Object.defineProperty(target, key, sharedPropertyDefinition)
这个
target
就是传入的
vm
,sourceKey就是传入的
_data
,
key
是传入的message,所以最后通过
this[sourceKey][key]
相当于
this._data.message
拿到值