使用 useFetch 文件上传的 Nuxt 3 在服务器端变成空对象为什么

Question

我创建了一个具有以下字段的表单

const formData = ref({
  title: undefined,
  categories: [],
  pimage: undefined
})

要处理图像，我有以下功能

const handleImageUpload = (event) => {
  formData.value.pimage = event.target.files[0];
};

现在我正在向后端发送数据

const { data } = await useFetch('apiurl/create/', { method: 'post', body: formData.value })

在 console.log 中一切正常，检查 formData.value，它输出所有数据标题、类别和图片。 但相同的 pimage 在服务器端变成空对象在服务器中我使用 Django Rest 并且 pimage 变成

{ }

为什么会这样以及如何解决它？这绝对不是服务器端问题，因为当我使用

FormData()

发送相同的数据时，需要

append()

我能够获取 pimage 的每个字段，但随后我的类别不再是数组，它变成了字符串，这对于我的项目来说并不理想。所以我必须使用 formData.value 请帮我修复它。谢谢！！

Answer 1

尝试

const { data } = await useFetch('apiurl/create/', {
  method: 'post',
  body: JSON.stringify(formData.value),
  headers: {
    'Content-Type': 'application/json',
  },
});