FormData 发送 key:[value] 而不是 key:value 列表而不是单个值到后端我该如何修复它？

Question

我有一个带有图像和属性的复杂形式...当使用追加或设置在 vue quasar 应用程序中添加数据时，它工作正常，但问题是我收到了一个数据列表，即使是单个值：

const sendFormData = new FormData();
sendFormData.set('title', title.value || ''); 

在 api（django view request.data）中我得到：

 {...'title': ['']...}

但我希望它是这样的：

{...'title': ''...}

我想使用 formData 并想知道如何解决这个问题？我应该在后端解析它还是有一个我缺少的简单方法？我搜索，我找到的唯一解决方案是使用一个简单的 [key: string]: 未知对象，与使用 formData 不同，提前谢谢您。 ...只是提一下，我在 Pinia 商店中有一个函数可以处理这个问题，如下所示，但我认为这与问题无关。

  ...const formData = payload;

  try {
 
    const Response = await api.post(
     url,
      formData,
      {
        headers: { Authorization: `JWT ${accessToken}` },
      },
    );...

标题填充为

    <q-input
      v-model="title"
      filled/>

发送前控制台中的条目是：

我收到的数据如下：

 <QueryDict: {'attributes': ['[]'], 'title': ['test'], 'chosenproductclass': [''], 'categories': [''], 'structure': [''], 'meta_title': [''], 'meta_description': ['meta descriction'], 'is_public': [''], 'upc': ['']}>

Answer 1

您可以执行以下操作：-

const sendFormData = new FormData();
let valToSend = title.value;
if(Array.isArray(title.value)) {
  if(title.value.length === 1) {
     valToSend = title.value[0];
  } else if(!title.value.length) {
    valToSend = '';
  }
}
sendFormData.set('title', valToSend || '');