小程序上传图片

wxml:

<form class="page__bd" bindsubmit="formSubmit" bindreset="formReset">
<view class="tupian">
<view class='loadpic' >
<block wx:for="{{imgArr}}" wx:key="id">
<image src="{{item}}" mode="widthFix" data-id="{{index}}" bindtap="deleteImv"/>
</block>
</view>
<view class='loadpic' bindtap="chooseImage" >
<image src="../../image/xj.png" mode="widthFix"></image>
</view>
<view class="zhu">请将学生证置于取景框内拍摄,确保照片清晰、不反光</view>
<view class='dl'>
<image src='../../image/d1.png' mode='widthFix' class='fl '></image>
<input placeholder='请输入您的身份证号码' name="card" placeholder-class='ziti' class='fr'></input>
</view>
<input type="hidden" style="display:none" name="img" value="{{img}}"> </input>
<button class='dlu' form-type='submit'>确认提交</button>
</view>
</form>

 

js:

chooseImage: function () {
var that = this;

let token= wx.getStorageSync('token');
let wxapp_id= 10001;
/* wx.showToast({
title: '正在上传...',
icon: 'loading',
mask: true,
duration: 10000
});*/
wx.chooseImage({
count: 8,
sizeType: ['original', 'compressed'],
sourceType: ['album', 'camera'],
success: function (res) {
if (res.tempFilePaths.count == 0) {
return;
}
//上传图片
var imgArrNow = that.data.imgArr;
var upurl=App.api_root +'index/upload'
imgArrNow = imgArrNow.concat(res.tempFilePaths);

that.setData({
imgArr: imgArrNow
})
for (var i = 0; i <imgArrNow.length;i++){
wx.uploadFile({
url: upurl,
filePath: imgArrNow[i],
name: 'file',
formData: {token:token,wxapp_id:wxapp_id},
header: {
"content-type":'application/x-www-form-urlencoded'
},
success: function (res) {
//console.log(JSON.parse(res.data).url);return false;
var img = that.data.img;
img = img.concat(JSON.parse(res.data).data);
that.setData({
img: img
})
},
})
}

that.chooseViewShow();
}
})
},

deleteImv: function (e) {
var imgArr = this.data.imgArr;
var img = this.data.img;
var itemIndex = e.currentTarget.dataset.id;
imgArr.splice(itemIndex, 1);
img.splice(itemIndex, 1);
this.setData({
imgArr: imgArr,
img:img
})
//判断是否隐藏选择图片
this.chooseViewShow();
},
chooseViewShow: function () {
if (this.data.imgArr.length >= 9) {
this.setData({
chooseViewShow: false
})
} else {
this.setData({
chooseViewShow: true
})
}
},

posted @ 2021-04-17 11:19  小小强丶  阅读(72)  评论(0编辑  收藏  举报