<!-- HTML -->
<div id="test1">
<input type="file" name="image" accept="image/*" @change='onchangeImgFun1' class="layui-btn" style="opacity: 0;height: 150px;position: relative;z-index: 1;">
<img v-show="isZheng" id="demo1" :src='sfz1' ref="demo1pic"
style="position:absolute;top: 0;bottom: 0;left: 0;right: 0;background-color: rgba(0,0,0,0); width:100%; height: 200px;border-radius: 5px;" />
</div>
<div id="test2">
<input type="file" name="image" accept="image/*" @change='onchangeImgFun2'
class="layui-btn" style="opacity: 0;height: 150px;position: relative;z-index: 1;">
<img v-show="isFan" id="demo2" :src='sfz2' ref="demo2pic"
style="position:absolute;top: 0;bottom: 0;left: 0;right: 0;background-color: rgba(0,0,0,0); width:100%;height: 200px;border-radius: 5px;" />
</div>
new Vue({
el: '#shop',
data() {
return {
isZheng:false,
isFan:false,
sfz1:'',
sfz2:'',
}
},
methods: {
// 上传图片
onchangeImgFun1: function (e) {var file = e.target.files[0];
console.log(file)
let formData = new FormData();
formData.append('file', file);
axios.post('/nineth_app/storage/store?fileType=0',formData,{
headers: {
Authorization: this.toke,
Accept: 'application/json',
}
}).then((res) => {if (res.code == 1) {$('#demo1').attr("src", '');
return alert('上传失败');
}
// 上传胜利
if (res.code == 0) {
this.isZheng = true;
this.sfz1 = res.data
}
}).catch();},
onchangeImgFun2: function (e) {var file = e.target.files[0];
console.log(file)
let formData = new FormData();
formData.append('file', file);
axios.post('/nineth_app/storage/store?fileType=0',formData,{
headers: {
Authorization: this.toke,
Accept: 'application/json',
}
}).then((res) => {if (res.code == 1) {$('#demo2').attr("src", '');
return alert('上传失败');
}
// 上传胜利
if (res.code == 0) {
this.isFan = true;
this.sfz2 = res.data
}
}).catch();},
},
mounted() {}
})