Vue中的computed计算属性在生命周期中的执行阶段
今天在做Vue练习时候,用到了computed计算属性get()和set()操作,由于是从子组件将值扔给父组件中计算属性的,我就想到created不是页面加载最初执行的钩子么?就有了computed和created谁先谁后的问题。然后查阅网上答案,思否的一篇解释的比较靠谱,特来总结下,方便再看。结论:computed的初始化是在beforeCreated和created之间完成的分析:1.在new
·
今天在做Vue练习时候,用到了computed计算属性get()和set()操作,由于是从子组件将值扔给父组件中计算属性的,我就想到created不是页面加载最初执行的钩子么?就有了computed和created谁先谁后的问题。然后查阅网上答案,思否的一篇解释的比较靠谱,特来总结下,方便再看。
结论:
computed
的初始化是在beforeCreated
和created
之间完成的
分析:
1.在new Vue()
的时候,vue\src\core\instance\index.js
里面的_init()
初始化各个功能
function Vue (options) {
if (process.env.NODE_ENV !== 'production' &&
!(this instanceof Vue)
) {
warn('Vue is a constructor and should be called with the `new` keyword')
}
this._init(options) //初始化各个功能
}
2.在_init()
中有这样的一个执行顺序:其中initState()
是在beforeCreate
和created
之间
initLifecycle(vm)
initEvents(vm)
initRender(vm)
callHook(vm, 'beforeCreate')
initInjections(vm) // resolve injections before data/props
initState(vm) //初始化
initProvide(vm) // resolve provide after data/props
callHook(vm, 'created')
3.在initState()做了这些事情:
if (opts.props) initProps(vm, opts.props)//初始化Props
if (opts.methods) initMethods(vm, opts.methods)//初始化methods
if (opts.data) {
initData(vm)} else {
observe(vm._data = {}, true /* asRootData */)}//初始化data
if (opts.computed) initComputed(vm, opts.computed)//初始化computed
4.所以Props
,methods
,data
和computed
的初始化都是在beforeCreated
和created
之间完成的。
更多推荐
已为社区贡献5条内容
所有评论(0)