如何发送嵌套的 object 对象数组，包括 FormData 中的文件？

Question

我有一个嵌套的 object ，其中一些值是对象的 arrays 。 这些对象有一个字段作为文件。 这是 object 结构。

{
  "shop_name":"Organic Farm Shop",
  "shop_logo": File,
  "description":"Lorem ipsum dolor sit amet consectetur adipisicing elit. ",
  "category":"Grocery",
  "shop_url":"organic-farm",
  "product_details":[
    {
      "product_name":"Fresh Carrots",
      "product_image": File,
      "price":45,
      "stock":10,
      "unit":"Kg",
      "catogoryName":"Frozen Foodss"
    },
    {
      "product_name":"Fresh Cucumbers",
      "product_image": File,
      "price":80,
      "stock":20,
      "unit":"Kg",
      "catogoryName":"Frozen Foodss"
    }
  ],
  "page_input":[
    {
      "inputLabel":"Address",
      "inputType":"multiline_text"
    },
    {
      "inputLabel":"Mobile Number",
      "inputType":"numbers"
    }
  ]
}

我如何 append 这个到 FormData？ 或者有没有更好的方法可以在不使用 FormData 的情况下做到这一点？

Answer 1

您应该首先对其进行字符串化：

var expressiveObjectVariableName = JSON.stringify(expressiveObjectName);

然后正常 append 就可以了。

form.append('expressiveFieldName', expressiveObjectVariableName );

更多信息

编辑：

对于嵌套对象，arrays 和文件，描述的问题，试试这个：

JavaScript版

function toFormData(obj, form, namespace) {
    let fd = form || new FormData();
    let formKey;
  
  for(let property in obj) {
    if(obj.hasOwnProperty(property) && obj[property]) {
      if (namespace) {
        formKey = namespace + '[' + property + ']';
      } else {
        formKey = property;
      }
     
      // if the property is an object, but not a File, use recursivity.
      if (obj[property] instanceof Date) {
        fd.append(formKey, obj[property].toISOString());
      }
      else if (typeof obj[property] === 'object' && !(obj[property] instanceof File)) {
        toFormData(obj[property], fd, formKey);
      } else { // if it's a string or a File object
        fd.append(formKey, obj[property]);
      }
    }
  }
  
  return fd;
}

TypeScript版

function createFormData(object: Object, form?: FormData, namespace?: string): FormData {
    const formData = form || new FormData();
    for (let property in object) {
        if (!object.hasOwnProperty(property) || !object[property]) {
            continue;
        }
        const formKey = namespace ? `${namespace}[${property}]` : property;
        if (object[property] instanceof Date) {
            formData.append(formKey, object[property].toISOString());
        } else if (typeof object[property] === 'object' && !(object[property] instanceof File)) {
            createFormData(object[property], formData, formKey);
        } else {
            formData.append(formKey, object[property]);
        }
    }
    return formData;
}