共计 2305 个字符,预计需要花费 6 分钟才能阅读完成。
执行步骤:
点击“上传图片”按钮弹出弹窗,抉择图片点击“确定”图片上传胜利后弹窗敞开,再点击上传图片会发现弹窗会保留有上次选中图片的数据。
开发要求:
图片上传胜利后默认革除上一次选中上传的图片数据。
解决办法:
<view class="pop-up1" @click="rule1=true"> 弹窗 1 </view>
<view class="sure_btn" @click="formData.type = 2;showOne()">
<p> 上传图片 </p>
</view>
</view>
<!-- 弹窗 -->
<view class="boxBm test_pop" v-if="isLower">
<view class="box2 share-state">
<image class="img_close" @click="closePop" src="../../../static/img/koreaActive/close.png" mode=""></image>
<view class="addImg">
<image class=""@click="addImg(),imgItem=true"src="../../../static/img/japanActive/upload.png"mode=""></image>
</view>
<textarea class="active_text" maxlength="1000" @input="getText" v-model="formData.remarks" placeholder="您尊贵的意见和倡议......" />
<button type="default" @click='uploadImage()'> 確定 </button>
<view class="Img_box" v-if="imgItem" v-for="(item,index) in imgList" :key="index">
<image class="Img_item" :src="item" mode=""></image>
</view>
</view>
</view>
<script>
import api from '@/apis/api.js'
import URL from '@/common/config.js'
export default {data() {
return {
token:'',
showShare: false,
isLower: false,
imgList:[],
List:'',
rule1:false,
formData: {
pic: "",
remarks:"",
type:0
},
}
},
async onLoad(e) {if (e.lang) {
this.$i18n.locale = e.lang
this.lang = e.lang
} else {this.lang = 'en'}
console.log("eee",e)
await this.$onLaunched;
// 获取浏览器缓存的 token
this.token = localStorage.getItem('token')
},
methods: {
// 弹出弹窗
showOne(){
this.showShare=true;
this.isLower = true;
// console.log('this.showShare',this.showShare)
},
// 革除上一次选中的图片数据
closePop() {
this.formData = {
pic: "",
remarks:"",
type:0
}
this.imgList = []
this.List = []
this.isLower=false
},
// 点击抉择图片
addImg() {
uni.chooseImage({
count: 3, // 默认 9
sizeType: ['original', 'compressed'], // 能够指定是原图还是压缩图,默认二者都有
sourceType: ['album'], // 从相册抉择
loop: true,
success: res => {// console.log(res);
if (res.tempFilePaths.length != 0) {this.imgList.push(res.tempFilePaths[0]);
}
var tempFiles = res.tempFiles[0];
uni.uploadFile({
url: URL.httpurl + '/api/common/upload',
file: tempFiles,
method: 'POST',
name: 'file',
header:{token: this.token,},
success: uploadFileRes => {var data_ =JSON.parse(uploadFileRes.data)
console.log('data_',data_)
this.formData.pic = data_.data.url;
this.formData.pic = data_.data.url;
// console.log('上传图片', JSON.parse(uploadFileRes.data));
},
fail(err) {console.log(err);
}
});
}
});
},
// 点击“确定”上传图片
uploadImage(){this.$apis.saveImg(this.formData)
.then(res => {console.log(res)
uni.showToast({// 提醒
title: res.msg,
// lang:this.lang,
})
// 执行革除数据办法
this.closePop()})
}
}
</script>
正文完