生成word文档的第一步和第二步
1. 页面按钮引用
<div style="display:inline-block;margin-left:10px">
<el-button type="primary" @click="downWord()" style="margin-bottom:10px">
Word下载
</el-button>
</div>
页面展示:
2. 前端方法
downWord() {
let page = 1;
let rows = 50;
//调用的后端方法
downloadWord({
tyshxydm: this.tyshxydm, pxbid: this.pxbid, page: page, rows: rows }).then((res) => {
console.log("出参", res.data);
this.downloadFileByBase64(res.data.map.base64, "application/msword", "研修培训项目实施方案");
});
},
downloadFileByBase64(base64Str, mimeTypeStr, fileName) {
let myBlob = this.dataURLToBlob(base64Str, mimeTypeStr);
let myUrl = window.URL.createObjectURL(myBlob);
this.downloadFile(myUrl, fileName);
},
dataURLToBlob(base64Str, mimeTypeStr) {
let bstr = window.atob(base64Str); // 解码 base-64 编码的字符串,base-64 编码使用方法是 btoa()
let length = bstr.length;
let u8arr = new Uint8Array(length); // 创建初始化为0的,包含length个元素的无符号整型数组
while (length--) {
u8arr[length] = bstr.charCodeAt(length); // 返回在指定的位置的字符的 Unicode 编码
}
return new Blob([u8arr], {
type: mimeTypeStr }); // 返回一个blob对象
},
downloadFile(hrefUrl, fileName) {
let a = document.createElement("a");
a.href = hrefUrl;
a.download = fileName; // 下载后文件名
document.body.appendChild(a);
a.click(); // 点击下载
document.body.removeChild(a); // 下载完成移除元素
}