我的需求是点击某个按钮或者图标去上传图片,但是这个功能只能每次选一张,需要多次点击。
html:
<view class="img-box">
<view class="im-con" v-for="(item,index) in fileList" :key="index">
<image :src="item" mode=""></image>
</view>
<view class="upload" @click="uploadImg" v-if="uploadFlag">
<u-icon name="camera-fill" color="#333333" size="28"></u-icon>
<text>照片/视频</text>
</view>
</view>
data:
//存放图片的集合
fileList: [],
js:
uploadImg() {
let that = this
uni.chooseImage({
count: 3, //默认9
sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图,默认二者都有
sourceType: ['album'], //从相册选择
success: (chooseImageRes) => {
// uni.setStorageSync("token", this.token)
console.log("token", that.token)
// this.personInfo.avatarImg = chooseImageRes.tempFilePaths[0]
// uni.setStorageSync("token",this.token)
console.log("chooseImageRes.tempFilePaths[0]",chooseImageRes.tempFilePaths[0])
uni.uploadFile({
//请求地址可以放在vuex中或者公用js中
url: 'http://81.70.239.172:9998/kst-client/uploadFile',
filePath: chooseImageRes.tempFilePaths[0],
name: 'files',
formData: {},
header: {
token: that.token
},
success: (uploadFileRes) => {
//console.log("uploadFileRes", uploadFileRes)
this.uploadFileList.push(JSON.parse(uploadFileRes.data).data[0])
this.fileList.push(this.imgUrl +
JSON.parse(uploadFileRes.data).data[0])
console.log("fileList", this.fileList)
//图片超过3张就让点击上传的图标隐藏,这里没有写删除图片功能
if(this.fileList.length>=3){
that.uploadFlag = false
}else{
that.uploadFlag = true
}
}
})
}
});
},
|