微信小程序chooseMedia上传图片后回显图片

前些天写微信小程序,发现wx.chooseImage文档上写着停止维护这个接口了,于是,咱们也就用chooseMedia来代替他。

前面的步骤还是一样的

wx.chooseMedia({
        count:9,

        mediaType:['image'],

        success:(res)=>{
                if(res.errMsg == "chooseMedia:ok") {
                    console.log(res.tempFiles)    //这个就是临时图片路径数组了
                    res.tempFiles.forEach(i=>{
                        this.imgArr.push(i.tempFilePath)    //放到自己的数组内
                    })
                }

        }
})

然后将数组直接上传就行。

当然除了上传,还有图片回显, 我们是用的oss上传的 后端返回给我的是两个数组,一个是上传数组,就是我们刚刚的 this.imgArr,还有一个是oss的路径数组  用来回显图片。这个时候就有问题来了  我们获得的wx.chooseMedia是带着http://的,上传之后却是不带http://的路径,所以wx.uploadFile是会报错的

我的解决办法是在onLoad/onShow时用wx.getImageInfo来获取图片地址,这个时候我们获取到的也就是带http://的,这时,我们再将这个数组上传给oss,就可以上传成功。

onLoad(){
	if (JSON.parse(this.form.remarkPicture)) { 
 //this.form.remarkPicture是后端返回的上传图片的数组
					JSON.parse(this.form.remarkPicture).forEach(i => {
						uni.getImageInfo({
							src: i,
							success: (res) => {
                                this.imgArr = []
								this.imgArr.push(res.path)
                                   //this.imgArr 是我们给后端的数组
							}
						})
					})
				}
}

  • 1
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值