vue3中实时监听a-form这种变化的值，打印旧值和新值

在Vue 3中，如果你想要实时监听`<a-form>`组件内的值的变化，你可以利用Composition API提供的reactive或ref函数来创建响应式数据，并结合`watch`或`on`选项来监听变化。

首先，你需要使用`ref`创建一个响应式的变量来存储表单的数据：

import { ref } from 'vue';

const formData = ref({}); // 创建一个初始为空的对象

然后，在表单元素内部，你可以将需要监听的属性绑定到这个响应式变量上：

<a-form v-model="formData.value" @input="handleInputChange"></a-form>

在这里，`v-model`用于双向数据绑定，而`@input`事件监听输入字段的变化。

接下来，创建一个方法来处理输入值的变化并打印旧值和新值：

methods: {
  handleInputChange(event) {
    const oldValue = this.formData.value; // 获取旧值
    this.formData.value = event.target.value; // 更新新值

    console.log('Old Value:', oldValue);
    console.log('New Value:', this.formData.value);
  }
}

这样，每当`<a-form>`的值发生变化，`handleInputChange`方法会被触发，打印出旧值和新值。