new vue()发生了什么

一:this._init()合并配置,初始化生命周,
初始化事件中心,初始化渲染,初始化
data、props、computed、watcher 等等

二:$mount() 挂载
> vue 不能挂载在 body html 上

> 判断有无 render 没有将 el template 转化成 render 利用compileToFunctions [
1. 正则解析template模板生成AST树
2. 优化AST树设添加static、根staticc标记(是否为静态html)
3. 生成render() 
]
> 调用 mount() [
1. 执行beforeMount生命周期
2. 创建 updateComponent = () => {
vm._update(vm._render(), hydrating)
}
3. 创建监听函数
new Watcher(vm, updateComponent, noop, {
before () {
if (vm._isMounted) {
callHook(vm, ‘beforeUpdate’)
}
}
}, true)首次渲染调用会执行updateComponent()
4. 调用render(调用_createElement函数)转换成Vnode,区分普通节点,和组件节点
5. _update (首次渲染,数据更新) 把 vode 渲染成 DOM 核心方法vm.__patch__将vnode 转换成DOM (区分组件和普通节点) 最后插入浏览器中(先子后父,插入父节点,递归遍历)
6. 执行mounted生命周期函数
]

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值