vue3 watch监听器的基本使用

最新推荐文章于 2023-08-21 18:59:04 发布

luckyMrTang

最新推荐文章于 2023-08-21 18:59:04 发布

阅读量407

点赞数

文章标签： vue.js 前端前端框架

本文链接：https://blog.csdn.net/luckyMrTang/article/details/127801551

版权

watch监听器主要是监听响应式数据变化比如ref,reactive包裹起来的数据,才可以被watch监听到,

//侦听单一数据源
let msg =ref(0)


wathc(msg,(newVal,oldVal)=>{

})

//侦听多个数据源
let one =ref(0)
let two= ref(0)
watch([one,two],(newVal,oldVal)=>{
//返回的值就变成数组
})

侦听对象
let obj = reactive({
 foo:{
   bar:{
       name:'程序猿',
       age:'23' 
   }
   }
})

watch(obj (newVal,oldVal)=>{
 //注意 如果不是reactive包裹的对象而是ref 则需要开启 deep:true
 }
 ,{deep:true}//ref需要
)

只侦听对象中某个值  例如监听obj 里面最深的name
watch(()=>obj.foo.bar.name,(newVal,oldVal)=>{

})