上传作品图片,上传头像(count=1),亲测有效分享一下核心代码,希望能帮助大家
1.wxml
!--上传作品--viewclass='upload-works'style='height:{{screenHeight}}px'wx:if="{{isUpWork}}"viewclass='work-box'viewclass='works-tit'图片上传:/viewviewclass='works-img'viewwx:for="{{worksImgs}}"wx:for-item="item"wx:key="this"!--图片缩略图--imagesrc="{{item}}"mode="aspectFill"/image!--移除图片的按钮--viewdata-index="{{index}}"catchtap="deleteImg"删除/view/viewviewclass='imgiconfonticontianjia'wx:if="{{worksImgs.length9}}"bindtap="chooseImage"/view/view/view!--按钮--viewclass='btns'buttonclass='cancle'catchtap='cancleWorks'取消/buttonbuttonclass='submit'catchtap='submitWorks'提交/button/view/view
2.js
chooseImage:function(){letthat=this;letworksImgs=that.data.worksImgs;letlen=that.data.worksImgs.length;wx.chooseImage({count:9-len,//最多选择9张图片sizeType:['original','compressed'],//可以指定是原图还是压缩图,默认二者都有sourceType:['album','camera'],//可以指定来源是相册还是相机,默认二者都有success:function(res){console.log(res);//返回选定照片的本地文件路径列表,tempFilePath可以作为img标签的src属性显示图片if(res.tempFilePaths.count==0){return;}lettempFilePaths=res.tempFilePaths;//lettoken=app.data.uptoken;//上传图片循环提交for(leti=0;itempFilePaths.length;i++){wx.uploadFile({url:'url',//此处换上你的接口地址filePath:tempFilePaths[i],name:'upload_file',header:{"Content-Type":"multipart/form-data",'accept':'application/json',},success:function(res){console.log(res);letdata=JSON.parse(res.data);//这个很关键worksImgs.push(data.data.url);that.setData({worksImgs:worksImgs})}})}}})},//删除上传的图片deleteImg:function(e){varworksImgs=this.data.worksImgs;varitemIndex=e.currentTarget.dataset.index;worksImgs.splice(itemIndex,1);this.setData({worksImgs:worksImgs})},//提交个人作品submitWorks:function(){letthat=this;letworksImgs=String(that.data.worksImgs);letobj={store_id:that.data.store_id,mode_id:that.data.mode_id,works_img:worksImgs,works_info:that.data.works_info,is_xs:1}if(obj.works_img.length==0||obj.works_info==''){wx.showModal({title:'提示',content:'数据不能为空!',showCancel:false,})}else{utils.postRequest('Mode/worksAdd',obj,'加载中',(res)={if(res.data.rc==200){wx.showModal({title:'提示',content:'作品上传成功',showCancel:false,success:function(res){if(res.confirm){that.setData({isUpWork:false})that.onShow();}}})}else{wx.showModal({title:'提示',content:'作品上传失败',showCancel:false,success:function(res){if(res.confirm){that.setData({isUpWork:false})that.onShow();}}})}})}},注意:微信公众平台小程序,开发栏目uploadFile合法域名,一定要配置图片保存的域名,例如:七牛云等等
最新资讯
-

小程序制作平台选型踩坑记录:2026年五大主流方案横向对比
2026 年微信小程序月活达 10.7 亿、覆盖 108 个行业,本次横向对比即速应用、乔拓云、凡科、有赞、微盟五大主流平台,分三阶段给出选型结论,核心聚焦成本、扩展性、运营能力三大维度。 -

即速应用,赋能企业玩转微信小程序智慧经营
作为国内领军的智慧商业经营服务商,即速应用始终秉承“让每个企业都拥有自己的智慧店铺”的愿景,持续赋能更多企业玩转智慧经营。即速应用旗下拥有“小程序搭建工具-即速应用”、“私域流量专家-即客云”等产品,帮助商家打通互联网全生态营销闭环。 -

即客云2.0重磅更新,让微信小程序运营更简单!
即客云作为一款基于企业微信的第三方工具,现从多维度提供超过30种功能,自上线以来,已服务多家企业,受到一致好评。近期,我们根据客户反馈和市场调研正式推出升级版 即客云2.0!更新了私域运营SOP,群日历功能,批量拓客,客户雷达,消息推送,个人欢迎语,帮助企业更好运用企业微信;同时提升了社群运营工作标准化,提升运营效率,帮助企业实现客户增长,玩转私域流量。










