参数1:文件,参数2:回调方法拿到url
export function getImgBase64(file, callback) {
var url = "";
//创建文件阅读器
var reader = new FileReader();
//创建图片
var img = new Image();
//读取为数据url
reader.readAsDataURL(file);
//文件阅读器加载事件
reader.onload = (e) => {
img.src = e.target.result;
//图片加载事件
img.onload = () => {
var canvas = document.createElement("canvas");
var context = canvas.getContext("2d");
canvas.width = 200;
canvas.height = 100;
// 核心JS就这个图片绘制成canvas
context.drawImage(img, 0, 0, canvas.width, canvas.height);
// canvas绘制的图片转换成base64格式信息
url = canvas.toDataURL();
callback(url)
};
};
}
引入使用,调用如下
getImgBase64(file.file, (url) => { // console.log(url);在回调里做操作 // });