Vue首次渲染过程
2020-12-03 10:03:38 0 举报AI智能生成
Vue 首次渲染过程
作者其他创作
大纲/内容
Vue首次渲染过程(完整版/浏览器环境下）
Vue 初始化，实例化，静态成员
new Vue
this._init()
vm.$mount()
src/platforms/web/entry-runtime-with-compiler.js
这个mount只有在完整版时才会执行
compileToFunctions() 生成 render() 渲染函数
options.render = render
src/platforms/web/runtime/index.js
mountComponent()
src/core/instance/lifecycle.js
判断是否有render选项，如果没有但是传入了模板，并且当前是开发环境的话会发送警告
触发 beforeMount
定义 updateComponent
vm._render()渲染，渲染虚拟DOM
vm._update()更新，将虚拟DOM转换成真实DOM
创建 Watcher 实例
updateComponent 传递
调用 get 方法
触发 mounted
retrun vm
watcher.get()
创建完 watcher 会调用一次get
调用 updateComponent()
调用 vm.render() 创建 VNode
调用实例化时Vue传入的render()
或者便宜 template 生成的 render()
返回 VNode
记录vm.$el
0 条评论
回复 删除
下一页
