最新下载
热门教程
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
微信小程序 上传头像的实例详解
时间:2022-11-14 22:57:54 编辑:袖梨 来源:一聚教程网
微信小程序 上传头像的实例详解
最近在做微信小程序上传头像和上传照片功能就随手写一下代码:
上传头像html:
头像
js代码:
// 切换头像 changeAvatar: function () { var that = this; // var childId = wx.getStorageSync("child_id"); // var token = wx.getStorageSync('token'); wx.chooseImage({ count: 1, // 最多可以选择的图片张数,默认9 sizeType: ['compressed'], // original 原图,compressed 压缩图,默认二者都有 sourceType: ['album', 'camera'], // album 从相册选图,camera 使用相机,默认二者都有 success: function (res) { console.log(res.tempFilePaths + "修改页面") var avatar = res.tempFilePaths; that.setData({ avatar: avatar, upAvatar:true }) }, fail: function () { // fail }, complete: function () { // complete } }) }, 这是是调用上传头像uploadFile方法 // 上传头像 app.uploadimg({ url: 'URL地址', path: avatar, header: { 'Content-Type': 'multipart/form-data', "Authorization": "Bearer " + token }, isShow: false }); 上传头像代码uploadFile做了一个封装 代码放在APP.js里 //多张图片上传 uploadimg:function(data){ var that= this, i=data.i ? data.i : 0, success=data.success ? data.success : 0, fail=data.fail ? data.fail : 0; wx.uploadFile({ url: data.url, filePath: data.path[i], name: 'fileData',//这里根据自己的实际情况改 header: data.header, formData: { sequence:i+1 }, success: (resp) => { success++; console.log(resp) console.log(i+"成功"); } }, fail: (res) => { fail++; console.log('fail:' + i + "fail:" + fail); }, complete: () => { console.log(i); i++; if (i == data.path.length) { //当图片传完时,停止调用 console.log('执行完毕'); console.log('成功:' + success + " 失败:" + fail); } else {//若图片还没有传完,则继续调用函数 console.log(i); data.i = i; data.success = success; data.fail = fail; that.uploadimg(data); } } }); },
uploadFile 提交默认是post方法,后台给的接口的时候需要后台做成post
相关文章
- 《原神》5.2卡池抽取建议 11-14
- 《原神》5.2版本新怪物介绍 11-14
- 《原神》希诺宁增伤触发方法 11-14
- 《原神》循音觅奇活动入口 11-14
- 《原神》循音觅奇兑换码获取方法 11-14
- 《原神》花羽会活动飞行技巧介绍 11-14