
Hbuilder中微信小程序上传多图的案例分享
来源:
浏览:134
时间:2023-08-11
1、实现效果图如下:
描叙:最后那个加号+是上传图片的按钮。每张图片右上角有删除按钮。
我这里限定每行显示三张图片。
2、具体代码如下:
页面data()中定义一个待上传图片的数组变量 tempFiles:[],:
页面View内容:
car-list 下最后一个car-item 是我们的上传图片添加按钮。
v-for 循环 tempFiles 图片。
methods z中定义添加图片和删除图片的方法:
3、页面的CSS样式(此处样式可以根据自己需求进行调整)
4、微信上传文件的方法
注:wx.uploadFile 方法需要小程序设置,上传文件合法域名才可使用。本地测试时,微信开发者工具可以选择不校验合法域名。
关于微信小程序多图上传,各位大佬还有没有更好的方式呢?欢迎评论区留言,我们共同探讨。


