showimg (e) {
let reader = new FileReader()
var file = document.querySelector('#uploadImg').files// 获取图片文件,得到的是一个数组(因为可以同时选择多张图片)(图片文件存储在input标签中的files属性中)
reader.readAsDataURL(file[0])// 调用方法转为base64编码的字符串形式
reader.onload = () => { // 文件读取成功完成时触发
let res = reader.result// 将读取结果赋值给img的src属性(读取结果存放在result中)
let imgData = {
'src': res,
'file': file[0],
'loadStatue': false
}
this.imgList.push(imgData)
e.target.value = ''
}
}, // showimg
uploadImg (e) { // 图片上传
let file = document.getElementById('uploadImg').files[0]
if (!/\.(jpg|jpeg|png|bmp|GIF|JPG|PNG)$/.test(file.name)) {
alert(this.$t('lang.messageList.xianzhi'))
return false
}
let size = (file.size / 1024 / 1024).toFixed(0)
if (size > 2) {
alert(this.$t('lang.messageList.sizexianzhim'))
return false
}
if (window.FileReader) {
var fr = new FileReader()
// add your code here
this.showimg(e)
} else {
this.$message.warning('Not supported by your browser!')
}
}, // uploadImg
在事件中获取e 之后操作图片完 后 将e.target.value = '' 即可解决