微信小程序开发中怎样实现图片上传

互联网 18-6-5

老规矩,直接上代码了。

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          }        })    }

相信看了本文案例你已经掌握了方法,更多精彩请关注php中文网其它相关文章!

推荐阅读:

微信小程序开发容器视图的使用

微信小程序开发中Android请求失败如何处理

以上就是微信小程序开发中怎样实现图片上传的详细内容,更多内容请关注技术你好其它相关文章!

来源链接:
免责声明:
1.资讯内容不构成投资建议,投资者应独立决策并自行承担风险
2.本文版权归属原作所有,仅代表作者本人观点,不代表本站的观点或立场
标签: 微信小程序
上一篇:php获取远程图片并下载保存到本地的方法分析 下一篇:微信小程序开发中怎样实现微信支付

相关资讯