使用formData和axios发送数据数组

Question

我将使用formData发送数组数据。后端接受带有连字符的数据数组; 例如，如果在postman中使用form-data如下：

id_barang : 122;288;383 (send 3 value id with dash ;)

如果我使用formData，是这样的吗？

  data [
       {
          id_barang : 122
       },
       {
          id_barang : 288
       },
       {
          id_barang : 383
       }
    ]
    
     let barang = data.map(x => x.id_barang).join(";");
     const f = new FormData();
     f.append("id_barang", barang);


     //please correct me if i'm wrong

我的后端

    id_barang_data := strings.Split(r.FormValue("id_barang"), ";") // => 1002;983;756
    
    for i, _ := range id_barang_data { // loop through the files one by one
            rSegAnalisaMethodDetail := models.SegAnalisaMethodDetail{}
            id_barang, err := strconv.Atoi(id_barang_data[i])
            if err != nil {
                responses.ERROR(w, http.StatusBadGateway, err)
            }

- Harry Wardana

Answer 1

您的代码没有问题。唯一缺少的是您没有提供使用 axios 发送请求的方式。当您使用 FormData 和 axios 一起使用时，您需要添加 'Content-Type': 'multipart/form-data'。但是如果您没有向 Formdata 添加任何文件，则不需要使用 Formdata。

以下是完整的操作：

var banyakBarang = [
    { id_barang: 122 },
    { id_barang: 288 },
    { id_barang: 383 }
];

var barangString = banyakBarang.map(function(barang) {
    return barang.id_barang;
}).join(';');

var formData = new FormData();
formData.append('id_barang', barangString);

axios({
    method: 'post',
    url: '/x',
    data: formData,
    headers: {
        'Content-Type': 'multipart/form-data'
    },
});

请求载荷：

id_barang: 122;288;383

- Aslam H

---

我已经使用过这个，先生，但是当我提交时，后端的数据没有被循环或者只有一个被输入。 如果您使用Postman，数据就可以正常工作。 - Harry Wardana

你需要对值进行split (js) / explode (php)操作。请展示你在后端如何处理它的代码。 - Aslam H

我已经更新了我的问题，加入了后端代码内容:D - Harry Wardana

我再次追踪了后端，似乎有另一个未被循环的表单导致“id_barang”循环失败，感谢您的回答kang,,, - Harry Wardana

Answer 2

您可以将数组转换为字符串并将其附加在FormData中，在后端，您可以解析该数据并相应地使用它。请查看以下示例。

let formData = new FormData();

let data = [
       {
          id_barang : 122
       },
       {
          id_barang : 288
       },
       {
          id_barang : 383
       }
    ]
formData.append("arr", JSON.stringify(data));


for (var value of formData.values()) {
   console.log(value);
}

- Prince Mittal

Answer 3

Axios有paramsSerializer选项，您可以将其设置为使用qs.stringify的逗号分隔数组格式。

const paramsSerializer = (params: any) => stringify(params, { arrayFormat: 'comma' });

- Taavi Kivimaa