vue项目中-打印页面中部分区域的内容

在项目的开发中遇到了点击打印，需要打印页面中部分的表格，实现方式如下

首先将需要打印的内容包裹起来：例如

<div id="subOutputRank-print">
<single-table :columns="columns" :tableData="tableData"></single-table>
</div>

当点击打印的时候，执行下面的方法：
// 打印
printContent(e){
let subOutputRankPrint = document.getElementById('subOutputRank-print');
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;
},

效果如下：



好了，这样就实现了打印页面的部分区域