Vue 异步执行 DOM 更新，但是为什么v-model却是实时更新的？

Question

官网上说：Vue 异步执行 DOM 更新。只要观察到数据变化，Vue 将开启一个队列，并缓冲在同一事件循环中发生的所有数据改变。如果同一个 watcher 被多次触发，只会一次推入到队列中。这种在缓冲时去除重复数据对于避免不必要的计算和 DOM 操作上非常重要。然后，在下一个的事件循环“tick”中，Vue 刷新队列并执行实际 (已去重的) 工作
但是为什么v-model的数据更新不是多次变更和一次来更新DOM？

Answer 1

机制不一样。
v-model其实是 :value + @input 组合的语法糖

Answer 2

v-model 当文本框change时 会触发 watch与computed函数
（大概说下vue 内部的一个机制）

==1：当你实例中定义了input，那么意味着需要对这个变量进行defineProperty的处理，并创建Dep对象，同时与之相关的 都会有一个引用
==2：watch中的input函数会变成一个Watcher对象，在data的input的Dep中保存一份引用
==3：computed中的compiledMarkdown函数会变成一个Watcher对象，所以需要在data的input的Dep中保存一份引用
4：还会存在另一份引用 用来把Virtual DOM和DOM进行比对 实现最简洁的渲染办法 （vue强大之处）然后实现页面数据的改变 也就是dom渲染

v-model 的大概流程 具体可以看看

https://mp.weixin.qq.com/s?__...