vue element-UI Upload 笔记

实现图片上传前预览功能，element-UI  Upload 组件绑定 on-change函数,触发事件后没有 file.url 属性，

一、解决：

let blob=file.raw;
let blobUrl=URL.createObjectURL(blob);
this.formData.monitorPic = blobUrl;

URL.createObjectURL() 方法目前在实验中，某些浏览器无效，未来可能发生变化。

链接：https://developer.mozilla.org/zh-CN/docs/Web/API/URL/createObjectURL

 

二、解决：

let that=this,reads = new FileReader();
	f = file.raw;
    //将文件以Data URL形式读入页面
	reads.readAsDataURL(f);
	reads.onload = function(e) {
	 that.formData.monitorPic = this.result;
	};

 

读取文件成功后，将图片base64赋值给图片src，关于FileReader有点bug，上传同一文件，方法执行不成功。

链接：https://blog.youkuaiyun.com/Corey_mengxiaodong/article/details/82563622