el-upload同时上传图片与对象

el-upload使用http-request属性实现覆盖默认上传行为，可在该方法中实现自定义上传。今天遇到个需要同时上传图片和对象的需求，找到了下面的思路，下面用伪代码实现。
前端

<el-upload
  ref="uploadRef"
  class="upload-demo"
  action=#"
  :on-change="handleChange"
  :file-list="fileList">
  <el-button @click="submit">点击上传</el-button>
</el-upload>
<script>
import { postRequest } from ""; // 封装好的api接口
export default {
	data() {
		return {
			fileList:[]
		}
	}
	methods: {
		httpRequest(params) {
		    // 覆盖默认上传方法，只添加上传图片，
		    // 不发送请求
			this.fileList.push(params.file)
		}
		submit() {
			// 使用formData打包上传
			const fd = new formData();
            
            // 调用httpRequest()，将图片添加至 fileList
            this.$refs.uploadRef.submit()

            // 添加图片
            this.fileList.forEach((item,index) => {
                fd.append(`img${index}`,item)
            });
            
            // 添加对象
            // 将对象转换为字符串，否则后端不好接受
            const stringObj = JSON.stringify({
                num:123,
                string:string,
                charArr:[1,2,3]
            })
            fd.append('object',stringObj)
            // 发送请求
            postRequest(fd).then(res => {
                console.log(res);
                this.fileList = []
            })
		}
	}
	
}
</script>

后端

@PostMapping("/upload")
	public void test(@RequestParam("img1")MultipartFile img1,
					 @RequestParam("stringObj") String stringObj) {
		/*因为此时请求的Content-Type = multipart/form-data,
		而@RequestBody不能接收这种Content-Type,所以前面会
		把对象转换为字符串*/
		/**
		 * 将字符串转换回需要接收的dto对象
		 * @param stringObj 由对象封装成的字符串
		 * @param DefinitionDto.class dto对象
		 */
		DefinitionDto definitionDto = JSONObject.parseObject(stringObj,DefinitionDto.class);
		
	}