生成文件下载功能
前端实现点击生成文件并下载。
2021-02-21 15:32:00
利用 a 标签 download 属性和 href 属性
element.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(text))
具体实现代码为
onDownload() {
const ele = this.renderer.createElement('a');
this.renderer.setAttribute(ele, 'href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(this.logSearch1.log));
this.renderer.setAttribute(ele, 'download', 'log.txt');
document.body.appendChild(ele);
ele.click();
document.body.removeChild(ele);
}
以上实现方式当遇到文本量多的时候会失效,因为href属性受浏览器对url长度的限制,超过限制长度会失效,可以使用blob对象,使用如下
onDownload() {
const ele = this.renderer.createElement('a');
// 修改部分
const blob = new Blob([this.logSearch1.log], {type: 'text/plain'});
this.renderer.setAttribute(ele, 'href', URL.createObjectURL(blob));
// 修改部分end
this.renderer.setAttribute(ele, 'download', 'log.txt');
document.body.appendChild(ele);
ele.click();
document.body.removeChild(ele);
}