【Uniapp-Vue3】watch和watchEffect监听的使用

想要使用watch监听需要引入watch:

import {watch} from "vue";

监听某一个变量(浅层监听):

watch(变量名, (newValue, oldValue)=>{...})

我们监听变量num,通过输入input去改变num的值:

监听对象中的某一个属性(深度监听):

watch(()=>变量名.value.属性名, (newValue, oldValue)=>{...})

如果我们想要对该对象的所有属性都进行深度监听,则使用如下写法:

watch(变量名, (newValue, oldValue)=>{...}, {deep:true})

我们使用如下写法以后修改person中的所有属性都会触发watch:

注意:开启全属性深度监听会在一定程度上降低代码的性能

程序启动时立即进行一次监听:

watch(变量名, (newValue, oldValue)=>{...}, {deep:true, immediate:true})

相关推荐
小桥风满袖2 分钟前
Three.js-硬要自学系列38之专项学习缓冲几何体
前端·css·three.js
Rubin933 分钟前
埋点方案实现
前端
斯~内克7 分钟前
Centrifugo 深度解析:构建高性能实时应用的开源引擎
前端·开源
tianchang18 分钟前
策略模式(Strategy Pattern)深入解析与实战应用
前端·javascript·代码规范
掘金安东尼27 分钟前
技术解析:高级 Excel 财务报表解析器的架构与实现
前端·javascript·面试
Hilaku28 分钟前
深入CSS层叠的本质:@layer如何优雅地解决样式覆盖与!important滥用问题
前端·css·html
天天扭码31 分钟前
AI时代,前端如何处理大模型返回的多模态数据?
前端·人工智能·面试
每天开心33 分钟前
一文教你掌握事件机制
前端·javascript·ai编程
LeeAt40 分钟前
真的!真的就一句话就能明白this指向问题
前端·javascript
阳火锅41 分钟前
都2025年了,来看看前端如何给刘亦菲加个水印吧!
前端·vue.js·面试