Vue.js FormData不发送 JSON 是指在使用 Vue.js 框架中的 FormData 对象时,无法直接将数据以 JSON 格式发送到服务器。
FormData 是一种用于创建表单数据的对象,常用于通过 AJAX 请求将表单数据发送到服务器。它可以模拟表单提交,支持文件上传和多部分编码。然而,FormData 对象默认以 multipart/form-data 格式发送数据,而不是以 JSON 格式发送。
要发送 JSON 数据,可以使用 Vue.js 的 axios 库或其他 AJAX 库将数据转换为 JSON 格式,并设置请求头的 Content-Type 为 application/json。以下是一个示例:
import axios from 'axios';
// 创建一个 FormData 对象
const formData = new FormData();
formData.append('name', 'John');
formData.append('age', 25);
// 将 FormData 转换为 JSON 格式
const jsonData = {};
formData.forEach((value, key) => {
jsonData[key] = value;
});
// 发送 JSON 数据
axios.post('/api/data', jsonData, {
headers: {
'Content-Type': 'application/json'
}
})
.then(response => {
console.log(response.data);
})
.catch(error => {
console.error(error);
});
在上述示例中,我们首先创建一个 FormData 对象,并向其添加表单数据。然后,我们通过遍历 FormData 对象的键值对,将其转换为 JSON 格式。最后,使用 axios 发送 POST 请求,并设置请求头的 Content-Type 为 application/json。
领取专属 10元无门槛券
手把手带您无忧上云