Vue3新增的两个生命周期分析解释【onRenderTracked()状态跟踪和onRenderTriggered() 状态触发】
创始人
2025-05-29 04:27:15
onRenderTracked() 状态跟踪是什么？
是一个状态跟踪，他会跟踪页面上所有的方法跟变量，也就是对我们return返回的属性和方法进行跟踪
作用
当页面有一个update的时候，会生成一个event对象，通过event对象查看代码/程序的问题所在
演示代码
{{ num }}
总结：刷新浏览器后，浏览器打印出就可以看到属性key，对应的就是num这个属性名
onRenderTriggered() 状态触发是什么？
状态触发，他不会跟踪每一个值，而是跟踪发生变化值得信息，并且新值和旧值都会给你展示出来
作用
可以展示变化值的信息，old和new的值
代码演示
{{ num }}
key:那边变量发生了变化
newValue:更新后的变量
oldValue:更新前的变量
target:目前页面中的响应变量或函数
get：依赖收集
set：依赖更新
相关内容
热门资讯
3月15日起维权大变！文旅部新...
2026年2月12日，上海闵行七宝老街，青石板路被往来游人踩得温润发亮。作为上海千年古镇的代表，这里...
预订火爆！虎门人的年夜饭，真香...
快过年了 大家的年夜饭菜单定好了吗 你最心水的团圆滋味 又是哪一道呢 春节将至，虎门各酒楼匠心备宴，...
六载破局 三千立势｜牛肉汉堡标...
六载耕耘，初心如磐。如今牛约堡已迎来全国签约门店突破3000大关的里程碑，从七年前一家不足20平米的...
贵州人年夜饭桌上C位菜之争
贵州人的年夜饭桌上， 哪道菜是你心里的绝对 “C 位”？ 除夕年夜饭 是中国人一年中最有仪式感的一餐...
上海社区食堂大厨手把手教你解锁...
食材新鲜、定位平价、锅气十足，更是居民的食品卖场、老字号小吃店、面包店、咖啡店……上海基本每个社区都...