//vue里面的HTML代码
<div id="modificationPreview">
<input type="file" accept="image/*" @change="changeFile" id="modificationFile" value="" />
<img :src="imageUrl" id="modificationImg">
</div>
//js代码
//图片选择预览函数
preiverImage(file,imgId){
let _this = this;
let fileImg = file.files[0];
// 确认选择的文件是图片
if(fileImg.type.indexOf("image") == 0) {
let img = document.getElementById('imgId');
let reader = new FileReader();
reader.onload = function(evt){
_this.imageUrl = evt.target.result;
}
reader.readAsDataURL(file.files[0]);
}else{
alert('请选择图片上传!');
}
},
//函数调用
changeFile(){
let imgaeId = document.getElementById('modificationImg');
let fileId = document.getElementById('modificationFile');
this. preiverImage(fileId,imgaeId)
},