橘猫敲代码 2022-09-07 20:33 采纳率: 70.4%
浏览 36
已结题

vue双向数据绑定原理

vue的双向数据绑定是同步的还是异步的,我的简单理解,vue双向数据绑定的原理是数据改变影响视图,视图改变影响数据,用数据劫持结合发布者订阅者模式的方式,通过Object.defineProperty()来劫持各个属性的setter,getter,在数据变动时发布消息给订阅者,触发相应的监听回调。那么它的数据绑定也是同步执行的。但是不确定。

  • 写回答

2条回答 默认 最新

  • hfhan_872914334 2022-09-08 09:21
    关注

    拿数据修改视图来说,数据修改后,会调用数据的setter,在setter中调用dep.notify()通知所有监听了该数据的Watcher,遍历所有Watcher,调用update函数,在这个函数里,如果Watcher设置了sync(三大类型Watcher暂无)会直接运行Watcher.run,这就是同步执行,如果没有设置sync,会调用queueWatcher把当前Watcher追加到队列中,延迟调用,这么做是为了提高性能,可以过滤重复的Watcher,可以把多次修改带来的更新进行合并。

    所以,双向数据绑定带来的试图更新和数据更新是异步的。比如修改了input的值,在input事件中获取到的值和v-modal绑定的值是不一样的,v-modal值会晚于input事件更新

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
  • CSDN-Ada助手 CSDN-AI 官方账号 2022-09-07 22:07
    关注
    评论
查看更多回答(1条)

报告相同问题?

问题事件

  • 系统已结题 9月17日
  • 已采纳回答 9月9日
  • 创建了问题 9月7日

悬赏问题

  • ¥15 IDEA构建失败?怎么搞
  • ¥15 求该题的simpson,牛顿科特斯matlab代码,越快越好
  • ¥30 求解,有偿,可商量价格
  • ¥15 编译arm板子的gcc
  • ¥15 C++代码报错问题,c++20协程
  • ¥15 c++图Djikstra算法求最短路径
  • ¥15 Linux操作系统中的,管道通信问题
  • ¥15 ansible tower 卡住
  • ¥15 等间距平面螺旋天线方程式
  • ¥15 通过链接访问,显示514或不是私密连接