vue打印局部区域样式CSS错乱不生效
程序员文章站
2022-06-23 18:04:37
...
最近vue项目要实现打印网页中局部区域的要求,但是用下列方式的时候显得样式全部都没有作用上
printContent(){
let subOutputRankPrint = document.getElementById('print'); // 要打印区域的元素id
console.log(subOutputRankPrint.innerHTML);
let newContent =subOutputRankPrint.innerHTML;
let oldContent = document.body.innerHTML;
document.body.innerHTML = newContent;
window.print();
window.location.reload();
document.body.innerHTML = oldContent;
return false;
}
后来折中一下,将打印区域的样式全部写成行间样式,就可以了
如下
打印情况如下
上一篇: 解决了部署到Heroku时无法显示bootstrap CSS样式的问题
下一篇: 变量名字的意义