vue 监听一个对象里的对象值的变化

Vue.js监听对象属性变化通常使用`v-model`、`$watch`、或者是响应式系统来实现。如果你想要监听一个嵌套对象属性的变化，可以这样做：

1. **使用`v-model`**: 如果目标对象是通过`data`里定义并传递给组件的，并且你想监听的是基础数据类型的改变，你可以直接绑定到模板上。

<template>
  <div>
    {{ object.value }}
    <!-- 使用 v-model 绑定 -->
    <input type="text" v-model="object.value">
  </div>
</template>

<script>
export default {
  data() {
    return {
      object: { value: '初始值' }
    };
  }
};
</script>

在这个例子中，当你修改`input`的值，`object.value`也会相应更新。

2. **使用`$watch`**：如果需要更精确地监控对象深层属性的变化，可以使用`$watch`方法，提供一个回调函数来处理变化。

export default {
  data() {
    return {
      object: { nested: { value: '' } },
    };
  },
  watch: {
    'object.nested.value': function (newVal, oldVal) {
      console.log('value has changed:', newVal);
    },
  },
};

在这里，只要`nested.value`有任何改变，都会触发回调。