vue3怎么清除form表单的值

在 Vue 3 中，可以使用 `ref` 和 `reset` 方法来清除表单的值。具体步骤如下：

1. 在表单元素中使用 `v-model` 绑定表单数据：

<form>
  <label>
    Name:
    <input type="text" v-model="formData.name" />
  </label>
  <label>
    Email:
    <input type="email" v-model="formData.email" />
  </label>
  <button type="button" @click="resetForm">Reset</button>
</form>

2. 在 `setup` 函数中定义表单数据和重置方法：

import { ref } from 'vue';

export default {
  setup() {
    const formData = ref({
      name: '',
      email: '',
    });
    const resetForm = () => {
      formData.value.name = '';
      formData.value.email = '';
    };

    return {
      formData,
      resetForm,
    };
  },
};

3. 在重置按钮上绑定 `resetForm` 方法：

<button type="button" @click="resetForm">Reset</button>

这样，当用户点击重置按钮时，表单数据就会被清空。