虚拟DOM(vdom)
vue利用VDOM的对象模型的模拟DOM结构
页面复杂 ,DOM结构的模拟就变得复杂因此
Vue使用了新的语法糖 ,叫做jsx(javascript+xml)也就是
虚拟DOM
render方法
将jsx通过render方法解析为对象模型
流程
第一次
template模板使用jsx语法进行编辑
通过render函数将jsx解析为vdom对象模型
将VDOM对象模型渲染为真实的DOM ,然后挂载到页面中
当数据改变时
重新生成VDOM
diff算法
真实DOM 对比 重新渲染的VDOM ,同级对比,
数据不一样的改变,一样的不变
操作数据 VDOM 比操作真实DOM速度快性能好
生命周期:
生命周期
在一个组件的从
创建到销毁的
一系列过程添
功能
控制组件
三个阶段 8个钩子函数 钩子函数 不写成箭头函数
箭头函数改变this指向
初始化
beforeCreate
createdbefore
Mountmounted
mounted
运行中
beforeUpdate
updated
销毁
beforeDestroy
destroyed