vue.js中监听属性变化获取变更前数据：简单值直接用watch回调的oldvalue参数；复杂对象需手动缓存快照；路由/vuex通过computed桥接后watch；清理副作用优先用watcheffect+oninvalidate。
Vue.js 中监听属性变化时，要拿到变更前的数据，关键看监听目标类型和写法。简单值直接可用参数，复杂对象需手动缓存旧值。
监听 ref 或顶层响应式变量：直接用回调参数
当监听的是一个 ref（如 count = ref(0)）或 reactive 对象的顶层属性（如 () => state.count），watch 回调函数会自动传入新旧两个值：
- 第一个参数是变更后的新值（
newValue） - 第二个参数是变更前的旧值（
oldValue） - 注意：若设置了
immediate: true，首次执行时oldValue为undefined，需加判断
监听 reactive 对象、嵌套字段或数组：必须手动缓存旧值
直接监听整个 reactive 对象（如 user）或深层路径（如 user.profile.name）时，watch 的 oldValue 往往只是同一引用，无法反映内部变化。此时推荐以下做法：
vue-composition-api-best-practices
Vue 3 组合式 API 与
热门下载
相关下载
精品课程
相关推荐
/
热门推荐
/
最新课程
最新文章