vue组件化流程
2022-04-15 18:19:13 21 举报
AI智能生成
vue组件化过程
作者其他创作
大纲/内容
组件声明:Vue.component()
全局声明/局部声明
全局声明/局部声明
src/core/global-api/assets.js
initAssetRegisters(Vue) 组件注册使⽤extend⽅法
将配置转换为构造函数并添加到components选项
将配置转换为构造函数并添加到components选项
组件实例创建及挂载
生成渲染函数
生成渲染函数
创建组件VNode
src/core/instance/lifecycle.js
updateComponent() 执行 render() 函数
src/core/instance/render.js
调用createElement()函数 ( 相当于h函数 )
src/core/vdom/create-element.js
兼容性处理
原始标签直接调用new VNode生成vnode
自定义组件调用createComponent()函数
原始标签直接调用new VNode生成vnode
自定义组件调用createComponent()函数
src/core/vdom/create-component.js
返回自定义组件的vnode
installComponentHooks 安装组件的钩子函数
init() 组件初始化调用(实例创建,挂载)
prepatch() 打补丁之前调用
insert() 被插入之后调用
destroy() 被摧毁的时候调用
创建组件实例
⾸次执⾏_update()时,patch()会通过createEle()创建根元素
core/vdom/patch.js
createEle() 调用 createComponent() 自定义组件创建过程 将vnode转换为dom 插入元素
0 条评论
下一页