Axios 在 foreach 中存储相同的信息

Question

我有一组对象需要在单击单个按钮时存储在数据库中。因此，我使用了 foreach 循环，并在循环内部执行了 AXIOS POST。 AXIOS 存储相同的信息/对象。数组的所有对象都没有保存有没有解决办法

let arr = [
            {
              name:'abc',
              co: 1
            },
            {
              name:'def',
              co: 2
            },
            {
              name:'ghi',
              co: 3
            },
         ];

    let fd = new FormData();
    arr..forEach((element) => {
          fd.append("name", element.name);
          fd.append("co", element.co);

    this.$http.post("po", fd, { headers: {
          "Content-Type": "multipart/form-data",
           },
          .then((res) => {
                console.log(res.data);
           })
          .catch((err) => {
                console.log(err);
          });
    });

当按如下方式映射数组时。发生错误 cannot read property co of undefined

let element=  this.formList.map((obj) => obj);
// appending data
// axios POST

它只保存最后一个对象。我想要的是每个对象都应该存储

Answer 1

我犯的错误是将 Axios 放在 foreach 中，它会在每次循环时覆盖对象，因此只存储最后一项。工作解决方案如下

save() {
  this.StoreMulti(this.arr, 0);
}

StoreMulti(arr, i){
 this.$http.post("po", fd, { headers: {
   "Content-Type": "multipart/form-data",
  },
  .then((res) => {
        if (i < arr.length - 1) {
            this.StoreMulti(arr, ++i);
        }
       onsole.log(res.data);
   })
   .catch((err) => {
       console.log(err);
   });
}

这通过发送 POST 一个一个地请求来存储整个数组

Axios 在 foreach 中存储相同的信息

Axios store same information inside foreach

mapping

foreach

vue.js

axios

vuejs2