您现在的位置是:网站首页> 编程资料编程资料
Vue3中watch监听使用详解_vue.js_
2023-05-24
478人已围观
简介 Vue3中watch监听使用详解_vue.js_
Vue2使用watch
总合:{{ sum }}
Vue3使用watch
watch有三个参数:
参数1:监听的参数
参数2:监听的回调函数
参数3:监听的配置(immediate)
情况1
监视ref所定义的一个响应式数据
总合:{{ sum }}
// 监视ref所定义的一个响应式数据

情况2
监视ref所定义的多个响应式数据
总合:{{ sum }}msg:{{ msg }}

情况3
监视reactive所定义的一个响应式数据
注意:
- 这里无法正确获取oldValue
- 强制开启了深度监听(deep配置不生效)
情况3::监视reactive所定义的一个响应式数据
姓名:{{person.name}}年龄:{{person.age}}
情况4
监视reactive所定义的一个响应式数据中的某个属性
情况4::监视reactive所定义的一个响应式数据中的某个属性
姓名:{{person.name}}年龄:{{person.age}}

情况5
监视reactive所定义的一个响应式数据中的某些属性
情况4::监视reactive所定义的一个响应式数据中的某个属性
姓名:{{person.name}}年龄:{{person.age}}

特殊情况
watch监听reactive中对象的嵌套对象
姓名:{{person.name}}年龄:{{person.age}}薪资:{{person.job.joblist.money}} K
总结
到此这篇关于Vue3中watch监听使用详解的文章就介绍到这了,更多相关Vue3中watch使用内容请搜索以前的文章或继续浏览下面的相关文章希望大家以后多多支持!
您可能感兴趣的文章:
