本文向大家展示了微信小程序中实现图片上传功能的详细代码示例，供大家借鉴。其中涉及到的API为wx.()，该API可用于拍摄照片、从手机相册中选择图片或视频。功能方面，用户点击上传图片按钮后，能够进行多图选择。
本文向读者展示了微信小程序中上传图片功能的详细代码示例，以供大家参考学习，具体内容包含：
用到的api
wx.(); 用于拍摄或从手机相册中选择图片或视频
点击图片上传功能，支持多图选择或直接拍照上传；选中图片后可放大预览；长按图片即可进行删除操作。
效果图
json里面引用weui的组件
{
navigationBarTitleText: 评价工单页面
"usingComponents": {
"该属性名为'mp-uploader'，其值指向路径'weui-miniprogram/uploader/uploader'。"
"mp-cells" 指的是 "weui-miniprogram" 下的 "cells" 文件夹中的 "cells" 目录。
"mp-cell" 指的是 "weui-miniprogram" 目录下的 "cell" 文件夹中的 "cell" 组件。
}
}
wxml
js
data:(){
技师评估图片：空数组，无内容。
}
// 上传技师图片
技术员图像处理函数：e{
var that = this;
获取技术人员评估图片的变量，赋值为当前数据中的技术人员评估图片。
若技术员评估图片的长度不少于九个字符，{
this.setData({
lenMore: 1
});
设置一个延时函数，随后执行：
that.setData({
lenMore: 0
});
}, 2500);
return false;
}
wx.chooseMedia({
count: 9, // 默认9
文件类型包括：图像和视频。
拍照功能仅限于捕捉图像，亦或从相册中挑选现成的图片。
视频拍摄或相册选视频，这两种方式仅此两种可选。
尺寸类型包括：原始尺寸，即原图；以及压缩尺寸，即经过压缩处理的图像。
当mediaType属性值为image时适用，需判断是否对所选文件进行压缩处理。
来源类型包括：相册，相机，用于选择图片和视频的来源。
最长拍摄时长为30秒，这指的是视频的拍摄时间，其计量单位为秒。该时长适用于视频拍摄，其取值范围介于3秒到60秒之间。此外，对于相册的使用则没有时长限制。
相机设置：仅当选择“相机”作为来源时适用，支持使用前置或后置摄像头。
采用后置摄像头进行拍摄；而使用前置摄像头进行自拍。
成功执行：当函数返回结果时，{
res对象中的临时文件路径被赋值给了变量tempFilePaths。
for (var i = 0; i < tempFilePaths.length; i++) {
if (technicianAssessPicture.length >= 9) {
that.setData({
技术人员评估图片：技术人员评估图片
});
return false;
} else {
tempFilePaths中的数据为JSON格式数组，而我们所需的是常规数组，因此需要对它进行相应的处理。
技术人员将临时文件路径数组中的第i个元素添加到评估图片的列表中。
}
}
that.setData({
技术人员评估图片：技术人员评估图片
});
console.log(that.data.technicianAssessPicture), 输出内容为 'hhhhhhhhhhhhhhhhhhhhh'。
}
});
},
处理后打印出来的数据
预览，删除
// 预览图片
预览技术人员：定义（e）{
//获取当前图片的下标
获取事件源元素的索引值，将其存储在变量index中，该索引值对应于e.currentTarget的dataset属性下的index键。
//所有图片
var technicianAssessPicture = this.data.technicianAssessPicture;
wx.previewImage({
//当前显示图片
当前为：技术人员评估的第index张图片。
//所有图片
URLs：技术人员评估图片
})
},
// 长按删除
删除技术人员：函数（e）{
var that = this;
将技术人员评估图片的数据赋值给变量technicianAssessPicture，该值来源于that.data对象中的technicianAssessPicture属性。
var index = e.currentTarget.dataset.index; // 提取当前被长按图片所对应的索引值
wx.showModal({
取消颜色：'cancelColor'，
title: '提示',
content: '确定要删除此图片吗？',
success: function (res) {
if (res.confirm) {
console.log('确定');
技术人员对图片进行评估后，执行了移除操作，具体是通过调整数组索引和数量来实现，即从指定位置删除了一个元素。
若响应结果为取消操作，{
console.log('取消');
return false;
}
that.setData({
技术人员评估图像
})
}
})
},
以上便是本文的全部论述，衷心希望它能对大家的学术研究带来益处，同时我们也期待大家能继续给予自由互联以大力支持。