使用 Formdata 获取 SubmitEvent
时间: 2024-04-21 22:23:19 浏览: 8
要使用 `FormData` 对象获取 `SubmitEvent` 的数据,你可以在表单提交事件处理函数中使用 `FormData` 构造函数来创建一个 `FormData` 对象,并通过 `event.target` 来获取表单元素。
以下是一个示例代码:
```vue
<template>
<form @submit="submitForm">
<input type="text" name="username">
<input type="email" name="email">
<button type="submit">Submit</button>
</form>
</template>
<script>
export default {
methods: {
submitForm(event) {
event.preventDefault(); // 阻止表单默认提交行为
const formData = new FormData(event.target); // 创建一个 FormData 对象,传入表单元素
// 通过 get 方法获取特定字段的值
const username = formData.get('username');
const email = formData.get('email');
console.log(username); // 输出 username 的值
console.log(email); // 输出 email 的值
// 进一步操作,例如发送给服务器等
}
}
};
</script>
```
在上面的代码中,我们在表单的提交事件处理函数中创建了一个 `FormData` 对象,并将表单元素 `event.target` 传递给构造函数。然后可以使用 `get` 方法来获取特定字段的值。
请根据你的具体需求和表单结构调整代码。如果还有其他问题,请随时提问。