上一主题 下一主题
ScriptCat,新一代的脚本管理器脚本站,与全世界分享你的用户脚本油猴脚本开发指南教程目录
返回列表 发新帖

[油猴脚本开发指南]VUE数据绑定的响应原理

[复制链接]
  • TA的每日心情
    慵懒
    2024-10-28 07:07
  • 签到天数: 193 天

    [LV.7]常住居民III

    712

    主题

    5961

    回帖

    6760

    积分

    管理员

    非物质文化遗产社会摇传承人

    积分
    6760

    荣誉开发者喜迎中秋油中2周年生态建设者

    发表于 2021-10-6 14:26:43 | 显示全部楼层 | 阅读模式

    前文

    这节课属于对数据响应机制的探究,属于加强篇

    如果有兴趣可以看看,不涉及实际的开发。

    原理

    Vue保证了数据的同步机制,即一旦我们修改了数据,数据发生变化,就会同步投射到模板上

    那到底是怎么做到的?

    首先会调用函数的data获取到对象

    对对象的每个属性创建一个监听器

    对我们写的模板需要调用数据的地方创建一个观察器

    观察期会将自己添加到监听器的通知对象上并读取目前的值,绘制到模板上

    而观察器会劫持数据的读写操作,一旦数据发生了改写,就会将通知监听器。

    监听器得到通知,并获取到最新的值

    然后再次更新到模板上。

    这样就完成了整个消息的通知。

    我们完成了数据与模板的绑定以及状态的更新。

    结语

    撒花~

    混的人。
    ------------------------------------------
    進撃!永遠の帝国の破壊虎---李恒道

    入驻了爱发电https://afdian.net/a/lihengdao666
    个人宣言:この世界で私に胜てる人とコードはまだ生まれていません。死ぬのが怖くなければ来てください。
  • TA的每日心情

    2022-8-15 10:58
  • 签到天数: 1 天

    [LV.1]初来乍到

    9

    主题

    80

    回帖

    89

    积分

    初级工程师

    积分
    89

    新人报道油中3周年挑战者 lv1

    发表于 2022-5-11 10:39:21 | 显示全部楼层
    vue第三篇,理解同步数据
    回复

    使用道具 举报

    发表回复

    本版积分规则

    快速回复 返回顶部 返回列表