执行步骤:
点击“上传图片”按钮弹出弹窗,抉择图片点击“确定”图片上传胜利后弹窗敞开,再点击上传图片会发现弹窗会保留有上次选中图片的数据。
开发要求:
图片上传胜利后默认革除上一次选中上传的图片数据。
解决办法:
<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>