先下载依赖------npm install html2canvas
install(Vue, options) {
//把你想打印区域的ID替换掉print
Vue.prototype.getPdf = function (print) {
var title = print
//调用Canvas方法
html2Canvas(document.querySelector(`#${print}`), {
allowTaint: true,
height: document.querySelector(`#${print}`).scrollHeight,
background: "#FFFFFF",
}).then(function (canvas) {
//转换成base64位的编码
let base64 = canvas.toDataURL('image/jpg', 1.0)
var byteCharacters = atob(
base64.replace(/^data:image\/(png|jpeg|jpg);base64,/, "")
);
var byteNumbers = new Array(byteCharacters.length);
for (var i = 0; i < byteCharacters.length; i++) {
byteNumbers[i] = byteCharacters.charCodeAt(i);
}
var byteArray = new Uint8Array(byteNumbers);
var blob = new Blob([byteArray], {
type: undefined,
});
var aLink = document.createElement("a");
aLink.download = "图片名称.jpg"; //这里写保存时的图片名称
aLink.href = URL.createObjectURL(blob);
aLink.click();
}
)
}
}
标签:byteCharacters,vue,aLink,打印,jpg,print,base64,var From: https://www.cnblogs.com/Qinhr/p/17116950.html