相关文章推荐
儒雅的保温杯  ·  impala recursive - CSDN文库·  3 月前    · 
讲道义的馒头  ·  JAVA ...·  1 年前    · 

向后台接口传递FormData格式的数组对象

在js中,new FormData() 对象后,可以通过 append(name, value) 的方式往该对象中添加添加数据。然而append的值只能是字符串或者blob(File)格式,对于复杂的数组中包含对象的数据怎么添加呢?下面是我使用的方法:

后台接口要求的入参格式:

<input type="text" name="title"/>
<input type="file" name="file"/>
<input type="text" name="description"/><br/>
<input type="text" name="chapterList[0].title"/>
<input type="file" name="chapterList[0].file"/>
<input type="text" name="chapterList[0].description"/><br/>
<input type="text" name="chapterList[1].title"/>
<input type="file" name="chapterList[1].file"/>
<input type="text" name="chapterList[1].description"/>

此种数据相当于json格式的:

"title": "title", "file": file, "description": "description", "chapterList": [ "title": "title0", "file": file0, "description": "description0" "title": "title1", "file": file1, "description": "description1"

使用FormData处理如下:

// vue data中的数据
form: {
    description: '',
    file: null,
    title: '',
    // 动态添加部分数据
    chapterList: [
        title: '',
        file: null,
        description: ''
// 转Formdata格式数据处理
 let data = new FormData()
 data.append('description', this.form.description)
 data.append('file', this.form.file)
 data.append('title', this.form.description)
 this.form.chapterList.forEach((item, i)=> {
   data.append(`chapterList[${i}].title`, item.title)
   data.append(`chapterList[${i}].file`, item.file)
   data.append(`chapterList[${i}].description`, item.description)

最后将data放在接口的参数里传给后台就可以啦~

the end ~

向后台接口传递FormData格式的数组对象在js中,new FormData() 对象后,可以通过 append(name, value) 的方式往该对象中添加添加数据。然而append的值只能是字符串或者文件的格式,对于复杂的数组中包含对象的数据怎么添加呢?下面是我使用的方法:后台接口要求的入参格式:&lt;input type="text" name="title"/&gt;&lt;input type="file" name="file"/&gt;&lt;input type="te
FormData是HTML5标准制定的一个新的封装对象,有了FormData对象,可以方便地通过javascript创建表单数据,直接以ajax发送到服务器中。 目前浏览器的支持情况为: 以上这篇深入理解HTML的FormData对象就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持软件开发网。
FormData对象,是可以使用一系列的键值对来模拟一个完整的表单,然后使用XMLHttpRequest发送这个”表单”。 在 Mozilla Developer 网站 使用FormData对象 有详尽的FormData对象使用说明。 但上传文件部分只有底层的XMLHttpRequest对象发送上传请求,那么怎么通过jQuery的Ajax上传呢? 本文将介绍通过jQuery使用FormData对象上传文件。 使用<form>表单初始化FormData对象方式上传文件 HTML代码 <form id="uploadForm" enctype="multipart/form-data"> let formDatas = new FormData(); let sealValues = t.sealValues; formDatas.append('pdfFile', t.parsePdfFile); for(let i=0,len=sealValues.length;i<len;i++){ let locationInfo = sealValues[i]; formDatas.append('sealLocationInfoList['+i+'].posX
js通过 formData传递对象后台必须有一个对应的实体类接收formData传递过来的值,并且接收的Controller 方法参数不能有注解 1.传递formData的ajax $.ajax({ url: '/raise_dust/file/insertDeviceVersion', data: formData, type: "post",
1、我们使用FormData有时候不仅仅要传给后端文件,还需要传给后端对象信息。 使用FormData对象是用key-value形式的,所以传对象不能传整个对象,要传属性, 后端接口对象接收即可,因为可以将传来的属性自动封装到实体类中(前端传来的属性名称和实体类 的属性名称一定要一致,否则无法封装)。 2、还有当我们传的对象里面还有引用对象的时候,比如User类里面还有一个Depot类,我们就应该这样 formData.append(“depot.id”, this.formData.depot.id)
FormData 对象的使用: 1.用一些键值对来模拟一系列表单控件:即将form 中表单元素的 name 与 value 组装成一个 queryString 2.异步上传二进制文件 一、创建formData对象 1、创建一个空对象: //通过FormData构造函数创建一个空对象 var formdata=new FormData(); //可以通过append()方法来追加数据 formdata.append("name","laotie"); //通过get
关于postman的form-data如何传递数组形式如何使用form-data传递数组?如何使用form-data传递map的数组? 故事前提:原本想用raw的格式传递json字符串,但咱们公司前端不支持,说要重新做一份代码来支持我这两个接口,于是就开始面向百度编程了。 当然在代码中咱们应该也要使用xxx[]接收,以下都是以golang为例。 如何使用form-data传递数组? 话不多说,直接上图 接收数组值 如何使用form-data传递map的数组传递map数组form-data接收m
要接收一个 FormData 数组对象,你可以在 Spring MVC 控制器方法中使用 `@RequestParam` 注解。假设你的表单中有一个名为 `formDataArray` 的数组对象,你可以这样接收: ```java @PostMapping("/formdata") public String handleFormData(@RequestParam("formDataArray") List<FormData> formDataArray) { // 处理 FormData 数组对象 return "success"; 在这个例子中,`@RequestParam` 注解中的参数值 `"formDataArray"` 对应了表单中的 FormData 数组对象的名称。Spring MVC 将会自动将表单数据转换成 `List<FormData>` 对象,并传递给控制器方法。 如果你的表单中还有其他的字段需要接收,你可以在控制器方法中添加更多的参数和注解。例如,假设表单中还有一个名为 `username` 的文本字段,你可以这样接收: ```java @PostMapping("/formdata") public String handleFormData(@RequestParam("formDataArray") List<FormData> formDataArray, @RequestParam("username") String username) { // 处理 FormData 数组和用户名 return "success"; 在这个例子中,Spring MVC 将会自动将表单中的 `username` 字段的值转换成 `String` 类型,并传递给控制器方法。