温馨提示×

温馨提示×

您好,登录后才能下订单哦!

密码登录×
登录注册×
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》

小程序开发中实现图片上传的方法

发布时间:2020-12-22 12:37:59 来源:亿速云 阅读:196 作者:小新 栏目:移动开发

小编给大家分享一下小程序开发中实现图片上传的方法,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!

老规矩,直接上代码了。

handleCancelPic() {        let id = this.data.dbId;         wx.chooseImage({           count: 3, // 默认9           sizeType: ['compressed'], // 可以指定是原图还是压缩图,默认二者都有          sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机,默认二者都有           success: res => {             // 返回选定照片的本地文件路径列表,tempFilePath可以作为img标签的src属性显示图片             var tempFilePaths = res.tempFilePaths;             this.setData({                 src: tempFilePaths             })             upload(this,tempFilePaths,'','');           }         })     } 然后一个封装好的方法function upload(page, path,way,id) {     console.log(path)   wx.showToast({     icon: "loading",     title: "正在上传"   });   var test = [],     that = this;  for (var i = 0; i<path.length; i++) {         wx.uploadFile({           url: api.CancelImg,           filePath: path[i],                     name: 'file',           header: { "Content-Type": "multipart/form-data" },           success: res => {             test.push(res);             wx.setStorageSync('cancelImg',test)             console.log(test)            if (res.statusCode != 200) {                wx.showModal({                 title: '提示',                 content: '上传失败',                 showCancel: false               })              return;             }else {                 wx.showModal({                     title: '提示',                     content: '上传成功',                     showCancel: false                 })              }           },           fail: function (e) {             console.log(e);             wx.showModal({               title: '提示',               content: '上传失败',               showCancel: false             })           },           complete: function () {             wx.hideToast();  //隐藏Toast           }         })     }

这个是多个图片上传的方法,单个图片上传的话,把循环去掉就好。主要是因为微信官方默认的就是一次上传一张图片这个很蛋疼。只能这么搞了。。。

以上是“小程序开发中实现图片上传的方法”这篇文章的所有内容,感谢各位的阅读!相信大家都有了一定的了解,希望分享的内容对大家有所帮助,如果还想学习更多知识,欢迎关注亿速云行业资讯频道!

向AI问一下细节

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

AI