小程序：上传图片，回显图片

最新推荐文章于 2024-05-15 18:14:43 发布

joyour

最新推荐文章于 2024-05-15 18:14:43 发布

阅读量1.7k

点赞数

分类专栏：小程序

本文链接：https://blog.csdn.net/qq_25103439/article/details/106937197

版权

小程序专栏收录该内容

10 篇文章 0 订阅

订阅专栏

//临时上传
afterRead() {
    uni.chooseImage({
        count: 6, //默认9
        sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
        //sourceType: ['album'], //从相册选择
        success: (res) => {
            let f: any = res;
            this.fileList.push(f.tempFiles[0]);
        }
    });
}

fileList这个回显刚刚上传的图片

//长传图片到后端接口，因为微信图片上次是一次一张上传，多张图片需要循环调用后端接口上传才行。

//按钮
{
....
    if(this.fileList.length){
       this.fileList.forEach((item:any)=>{
          this.uploadFileFun(item.path)
      })
   }

}

//上传图片
uploadFileFun(file:any){
    uni.uploadFile({
        url: `${process.env['VUE_APP_SERVICE_URL']}/gtpep-admin/workOrder/finishImage`,
        filePath: file,
        name: 'finishPhoto',
        header: {
            'ticket': uni.getStorageSync('ticket') || undefined,
            "Content-Type": "multipart/form-data"
        },
        formData: {
            wordOrderId:this.id
        },
        success: res => {
            console.log(res);
        },
        fail: error => {
            console.log(error);
        }

    })
}