Vue2 source code--life cycle

life cycle

beforeCreate

This hook function only initializes the event and life cycle. If the data obtained here is an undefined
initEvent, add the event attribute
initLifecycle to vm: initialize the empty attribute of vm.$options
initRender: initialize the attribute required for virtual dom
insert image description here
beforeCreate template has not yet is replaced.
insert image description here

create

initInjections(vm);
initState(vm);
1. The data of data is initialized here initData()
2. Let the data of data become responsive observe() and proxy();
3. Determine whether it is newly added or not Array, is not object
initProvide(vm);
callHook(vm, 'created');
insert image description here
insert image description here

insert image description here
insert image description here
The code after create; replace { {}} with data
insert image description here
$mount method
insert image description here
insert image description herereturn mount.call(this, el, hydrating) and jump to this method
insert image description here

Follow the moutComponent to enter beforeMount and mount what cycle

insert image description here

beforeMount

insert image description here
insert image description here
insert image description here

mountedinsert image description here

Guess you like

Origin blog.csdn.net/work33/article/details/124859079