微信小程序 从本地相册选择图片或使用相机拍照chooseImage()和预览图片previewIma
发表时间:2021-3-31
发布人:葵宇科技
浏览次数:94
要实现的效果如图所示

wxml:
<view class='suggest_img'>请提供相关问题的截图或照片</view><view class='img_box'><block wx:for="{{add_img}}" wx:key="{{index}}"><view class='have_img'><image src='{{item}}' class='sug_picture' data-num="{{index}}" catchtap='preview_img'></image><image src='../../images/delete_img.png' style='width:40rpx;height:40rpx;' data-num="{{index}}" class='delete_img' catchtap='delete_th'></image></view></block><view class='no_img' bindtap="gotoShow"><image src='../../images/no_img.png'></image><view>上传图片</view></view></view>
js:
data: {add_img:[]},gotoShow:function(){var that=this;wx.chooseImage({success: function(res) {// console.log(res.tempFilePaths)var src = res.tempFilePaths;var aa=that.data.add_img.concat(src)// console.log(aa)that.setData({add_img:aa})},})},delete_th:function(e){var num=e.currentTarget.dataset.num;var that=this;wx.showModal({title: '提示',content: '确定要删除吗?',success: function (res) {if (res.confirm) {that.data.add_img.splice(num,1)that.setData({add_img:that.data.add_img})} else if (res.cancel) {console.log('用户点击取消')}}})},preview_img:function(e){var cur_num=e.currentTarget.dataset.num;var img_list=this.data.add_imgwx.previewImage({current:img_list[cur_num],urls: this.data.add_img})},








