wxml：
view class="gallery" !--显示图片-- view class="item" wx:for="{{images}}" wx:key="index" image src="{{item}}" data-src="{{item}}" bindtap="previewImage" mode="aspectFit" / !-- 删除按钮 -- view class="delete" bindtap="delete" data-index="{{index}}" image src='../image/delete.png' mode="widthFix"/image /view /view !--添加图片-- view class="item2" bindtap="chooseImage" view class='addIcon'+/view /view /viewwxss：
.gallery { background: #fff; display: flex; justify-content: flex-start; flex-wrap: wrap; padding-bottom: 80px;}/*每张图片所占容器*/.item { position: relative; margin: 10rpx 2%; width: 46%; height: 442rpx; background: #f3f3f3;}.item image { width: 100%; height: 100%;}/*add按钮*/.item2 { margin: 10rpx 2%; width: 45%; height: 442rpx; text-align: center; line-height: 442rpx; font-size: 200rpx; background: #fff; color: #e4e5ea; border: 1px dashed #e4e5ea;}/*删除按钮*/.delete { width: 100%; position: absolute; left: 0; bottom: 0; height: 80rpx; font-size: 22rpx; text-align: center; background-color: rgba(0, 0, 0, 0.3); display: none;}.delete image { width: 44rpx; margin-top: 22rpx;}重点来了，js:
Page({ data: { images: [], pathsTmp: [] }, // 本地选择照片上传 chooseImage: function() { var that = this wx.chooseImage({ count: 9, sizeType: ['compressed'], sourceType: ['album', 'camera'], success: function(res) { that.setData({ //上传完并显示照片 images: that.data.images.concat(res.tempFilePaths) }); } }) }, // 删除照片 delete: function(e) { var that = this; var index = e.currentTarget.dataset.index; var images = that.data.images; images.splice(index, 1); that.setData({ images: images }); },})
