uniapp中的uni-file-picker组件多图上传问题

本文介绍如何在uniapp中使用uni-file-picker组件实现多图同步上传,以解决异步上传导致的图片回显错误问题。通过同步顺序上传,确保在删除图片时不会出错。
摘要由CSDN通过智能技术生成

前言:在uniapp官方文档中的uni-file-picker组件可实现图片上传功能,官方文档:uni-app官网 中的案例不能完全满足需求,在接口上传失败的时候,需要页面不回显失败的图片,仅回显显示上传成功的图片,因为多图异步上传顺序的问题,可能会导致同时操作list,以至于删除图片出错。所以我才用多图同步顺序上传来规避这个问题。

以下是代码:

view代码:

<uni-file-picker :value="filePathsList" :auto-upload="false" file-mediatype="image" mode="grid"
			file-extname="png,jpg" :limit="4" @select="handleSelect" @delete="handleDelete" @success="success" />

上传时的select代码:

async handleSelect(res) { // 上传图片
    await this.uploadImg(res.tempFilePaths,1);
},

uploadImg实现

asyn
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值