v-model和watch使用

v-model和watch都是Vue.js中用于监听数据变化的方法。

v-model是Vue.js中提供的一个指令，用于在表单元素上创建双向数据绑定。例如，在一个文本输入框中使用v-model指令，当用户修改输入框中的文本时，Vue.js会自动更新绑定的数据，反之亦然。

watch是Vue.js中提供的一个选项，用于监听数据对象的变化。当指定的数据对象发生变化时，watch会自动执行相应的回调函数。可以使用watch来监听数据对象的变化，并在变化时执行一些逻辑操作。

下面是v-model和watch的使用示例：

<template>
  <div>
    <input v-model="inputText" />
    <p>您输入的文本是：{{ inputText }}</p>
  </div>
</template>

<script>
export default {
  data() {
    return {
      inputText: ""
    };
  },
  watch: {
    inputText(newVal, oldVal) {
      console.log(`您输入的文本变化了，新值为：${newVal}，旧值为：${oldVal}`);
    }
  }
};
</script>

在上面的示例中，我们在一个文本输入框中使用了v-model指令来创建双向数据绑定，并且使用了watch来监听数据对象inputText的变化。当用户在输入框中输入文本时，v-model会自动更新inputText的值，watch会自动执行相应的回调函数。