Vue数据驱动视图更新原理?更新视图的过程是否是同步操作?
- Vue视图更新依赖于Object.defineProperty()的双向数据绑定,和diff算法
- Vue的数据是同步的,但视图更新是异步的。因为如果视图更新是同步的,会导致多次渲染浪费性能,所以内部做了去重(重新更新的值)和防抖(只更新最后一次的值)。在vue实例初始化后,会将data设置为响应式对象,当我们执行
this.xxx = 1时,会触发这个响应式对象的setter。在setter中,会触发更新,通知所有订阅了xxx的订阅者。但是这个触发更新并不是同步的,它会将所有的watcher都添加到一个队列,并在nextTick之后去更新视图。