需求:vue+iview 使用upload上传文件,同时还要提交简单的键值对和复杂嵌套的数

简单的这样格式是可以的

     upoladData: {
          'opUserId': id,
          'opUserName': name,
     },

但是这样的格式 是会报错的

    upoladData: {
          'opUserId':id,
          'opUserName': name,
          'otherData':{
              'code': codes
          }
        },

 

 

 

 

 

Ajax请求发送的FormData是"[object object]"

但是processData 这个属性 属于jquery下面的ajax的属性。

然后看了view upload 的源码 发现 使用的是XMLHttpRequest.send() ,参数都是转换成为 FormData 

 

 

FormData 模拟提交包含简单键值对和文件的Form表单时,如果是post请求,数据会以键值对形式被放在请求体中。这样是没有问题的

 upoladData: {
          'opUserId': id,
          'opUserName': name,
 },

但是对象里面再嵌套对象

 upoladData: {
          'opUserId':id,
          'opUserName': name,
          'otherData':{
              'code': codes
          }
        },

 

这样提交以后,后端接收到的projection是object,无法解析出projection的值。原因是multipart/form-data本来就只能发送文件和不嵌套的键值对

解决:把需要嵌套的json数据在发送前用JSON.stringfy()方法转为json字符串,放入form表单中,就可以了。

         let otherData = {
              'code': codes
          }
        upoladData: {
          'opUserId':id,
          'opUserName': name,
          'otherData':JSON.stringify(otherData)
        },    

 

posted on 2020-10-30 16:15  菜鸟正在进化  阅读(2420)  评论(0编辑  收藏  举报