1,图片上传功能
picUpload.wxml
<!-- 上传 S -->
<view class="img-list">
<!-- 上传列表 -->
<block wx:for="{
{imgList}}" wx:key="index">
<view class="img-li">
<view class="img-li" bindtap="previewImg">
<image class="uploading-icon" src="{
{item}}"></image>
</view>
<!-- 删除图标 -->
<image class="icon-delete" src="../../../images/uploadPic/delUpload.png" bindtap="deleteImg"></image>
</view>
</block>
<!-- 上传图片 S -->
<view class="img-li" wx:if="{
{imgList.length<=8}}" bindtap="chooseSource">
<image class="uploading-icon" src="../../../images/uploadPic/upload.png"></image>
</view>
<!-- 上传图片 E -->
</view>
<!-- 上传 E -->
picUpload.js
Page({
/**
* 页面的初始数据
*/
data: {
imgList: [], // 上传图片列表
},
// 点击添加选择
chooseSource: function () {
var _this = this;
wx.showActionSheet({
itemList: ["拍照", "从相册中选择"],
itemColor: "#000000",
success: function (res) {
if (!res.cancel) {
if (res.tapIndex == 0) {
_this.imgWShow("camera") //拍照
} else if (res.tapIndex == 1) {
_this.imgWShow("album") //相册
}
}
}
})
},
// 点击调用手机相册/拍照
imgWShow: function (type) {
var _this = this;
let len = 0;
if (_this.data.imgList != null) {
len = _this.data.imgList.length
} //获取当前已有的图片
wx.chooseImage({
count: 6 - len, //最多还能上传的图片数,这里最多可以上传5张
sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图,默认二者都有
sourceType: [type], //可以指定来源是相册还是相机, 默认二者都有
success: function (res) {
wx.showToast({
title: '正在上传...',
icon: "loading",
mask: true,
duration: 1000
})
// 返回选定照片的本地文件路径列表,tempFilePaths可以作为img标签的scr属性显示图片
v