首页  思维导图  详情



 



VUE组件化流程

2020-10-16 10:13:56   0  举报







分享方式 

AI智能生成

vue2的组件化

Vue.js

模板推荐

作者其他创作

大纲/内容

注册组件 Vue.component() 1. 利用vue构造函数的 extend 方法创建组件的构造函数 2. 将组件挂在到当前实例选项上  3. 返回当前生成的构造函数组件 src/core/global-api/assets.js

初始化时调用$mount() src/core/instance/init.js

执行扩展的mount 方法 将编译生成render函数并挂在到 $options    src/platforms/web/entry-runtime-with-compiler.js

再次执行mount里面的mountComponent 方法 src/platforms/web/runtime/index.js

先定义updateComponent方法 再 new watcher 此构造函数马上执行一次 updateComponent updateComponent 执行运行里面 render方法 /src/core/instance/lifecycle.js

render方法的执行 直接运行当前实例选项 $options 中的render方法 render.call(vm._renderProxy, vm.$createElement) 返回一个vdom src/core/instance/render.js

render 执行$createElement 查找当前实例中的components 如果有执行 createComponent 方法 src/core/vdom/create-element.js

render 执行$createElement 查找当前实例中的components 如果有执行 createComponent 方法  事件监听、钩子函数的安装(init,prepatch,insert,destroy) 返回vnode src/core/vdom/create-component.js

patch时调用前面安装的钩子 即安装组件 src/core/vdom/patch.js

 收藏

立即使用

VUE组件化流程

 收藏

立即使用

vue异步更新

Owen g

职业：暂无

去主页

 Collect

Get Started

组件化|模块化CICD

 Collect

Get Started

组件构成图

 Collect

Get Started

Vue组件化

 Collect

Get Started

vue3-组件化





0 条评论

下一页