vue3中的watch

  1. 简单的监听:

    const number=ref(0)
    watch(number, (newValue, oldValue)=>{
    //
    })

2.复杂类型:

复制代码
const user=reactive({
    name:'test',
    age:18
})

// 整体监听
watch(user, (oldValue, newValue)=>{
    //
})
// 监听某一属性
watch(()=>user.name, (oldValue, newValue)=>{
})
  1. watch第三个参数

    watch( user, (oldValue, newValue)=>{
    },{ deep: true, immediate:true})
    // 深度监听, 子孙属性
    // 立即监听,初始化就执行一次

  2. 还可以使用watchEffect监听

    watchEffect(()=>{
    console.log('user',user)
    })

相关推荐
wfsm5 小时前
flowable使用01
java·前端·servlet
excel5 小时前
深度解析:Vue <script setup> 中的 defineModel 处理逻辑源码剖析
前端
excel5 小时前
🧩 深入理解 Vue 宏编译:processDefineOptions() 源码解析
前端
excel5 小时前
Vue 宏编译源码深度解析:processDefineProps 全流程解读
前端
excel5 小时前
Vue SFC 编译器源码深度解析:processDefineEmits 与运行时事件生成机制
前端
excel5 小时前
Vue 3 深度解析:defineModel() 与 defineProps() 的区别与底层机制
前端
excel5 小时前
深入解析 processDefineExpose:Vue SFC 编译阶段的辅助函数
前端
dcloud_jibinbin5 小时前
【uniapp】小程序体积优化,分包异步化
前端·vue.js·webpack·性能优化·微信小程序·uni-app
桜吹雪5 小时前
自定义instanceof运算符行为API: Symbol.hasInstance
前端
qq_427506085 小时前
基于Vue 3和Element Plus实现简单的钩子函数管理各类弹窗操作
前端·javascript·vue.js