标签：binary res formData JS data file 上传 append 图片

一、获取File对象

// 获取File对象
	let firstImg = data.add_design.first_pic_whether.raw;

1、 用户上传的图片数据

.1.1、 图片数据详情

二、使用new formData()

	let binary = new FormData()
	binary.append('file',firstImg)
    binary.append('name','2')
	

三、发送数据

   PostData.call(this, '/newproduct/ImgUrlApi/postDemandData/', binary, res => {
      console.log(res);
   },'file')

axios封装代码

// post请求
async function PostData(url, formData, callback,file) {
    const uv = qs.stringify(formData);
    if (file) {
        const {data: res} = await $http.post(url, formData, {
            headers: {
            // 设置头
                'Content-Type': 'multipart/form-data;'
            }
        });
    } else {
        const {data: res} = await $http.post(url, uv );
    }
    if (res.code !== 200) {
        ElMessage.error(res.msg);
    } else {
        ElMessage.success(res.msg);
    }
    callback(res)
}

四、完整代码示例

function sendImg(arg) {
	//得到图片对象
      let firstImg = data.add_design.first_pic_whether.raw;
      
    //封装FormData
      let binary = new FormData()
      binary.append('file',firstImg)
      binary.append('name','2')
      
    //axios发送
      PostData.call(this, '/newproduct/ImgUrlApi/postDemandData/', binary, res => {
         	console.log(res);
         },'file')
      }
      
    // 注意：axios请求头设置
    headers: {
       'Content-Type': 'multipart/form-data;'
    }

五、请求预览

标签：binary,res,formData,JS,data,file,上传,append,图片
来源： https://blog.csdn.net/JankoY/article/details/122822263

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。