上传预览
这里是上传预览只是指选择本地图片进行预览
选择图片用的是 input[file=type],预览有两种方案:
1、FileReader
调用 readAsDataURL 方法,将文件转为 base64,赋值给img标签;
const reader = new FileReader();
reader.readAsDataURL(file); // file为上传选择的文件
reader.onloadend = function (ev) {
if (ev.target.readyState !== FileReader.DONE) return console.error('读取失败');
img.src = reader.result;
};
2、URL.createObjectURL()
调用 createObjectURL 方法将文件转为对象url,同样赋值给img标签;
let { type } = file;
let blob = new Blob([file], { type });
let objectURL = window.URL.createObjectURL(blob);
window.URL.revokeObjectURL(blob);
img.src = objectURL;
下载
1、FileSaver
直接用这个库就行了:https://github.com/eligrey/FileSaver.js
2、a 标签的 download 属性
download 属性 MDN 详细说明请点击查看
兼容性查看:https://caniuse.com/download
let link = document.createElement("a");
link.href = 'http://url';
link.download = '下载文件名称';
link.click();