vue监听对象数据的变化 watch

最新推荐文章于 2025-05-30 09:08:25 发布

Sunnymeta

最新推荐文章于 2025-05-30 09:08:25 发布

阅读量913

点赞数

CC 4.0 BY-SA版权

分类专栏： vue 文章标签： vue js

本文链接：https://blog.youkuaiyun.com/qq_39425927/article/details/107122444

vue 专栏收录该内容

20 篇文章

订阅专栏

本文详细介绍了在Vue中如何使用watch深度监听对象属性的变化。默认情况下，Vue的watch仅能监听基本类型的数据变化，对于对象等引用类型则无法直接监听其内部属性的变化。为解决这一问题，可通过设置watch选项中的deep参数为true来实现深度监听，从而实时捕获对象内部属性的变动。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

我们使用vue的时候都知道vue有一个很好用watch可以用来监听数据的变化，但是，默认的时候是监听不到对象变化的，这时候就要配置deep=true这个字段。
代码：

watch: {
    //  监听对象数据变化
    objData: {
      handler(newVal, oldVal) {
        console.log(newVal)
        console,log(oldVal)
      },
      deep: true  // 非常非常重要，这个是深度监听，默认是false。true的时候才能监听到对象的变化
    }