vue 导出多页pdf, window.print()实现

  • vue 导出多页pdf, window.print()实现已关闭评论
  • 19 次浏览
  • A+
所属分类:Web前端
摘要

如果你对分页打印没思路,而网上的现成方案又不适合,不妨进来看看,也许会对你有帮助.

如果你对分页打印没思路,而网上的现成方案又不适合,不妨进来看看,也许会对你有帮助.

由于工作环境是局域网,对于插件的安装有限制,所以排除了jspdf + html2canvas的实现方式;采用window.print(),就会涉及到表格的截断、文本的截断等问题,而且需求要求每一页的pdf都有固定的页眉页尾,这里好像...好像又行不通了...

但是能不能通过一种方式,把每页的内容都计算出来,然后再打印。顺着这种思路,首先需要计算页面中所有dom元素的高度,有没有一种方法可以循环获取当前页面所有dom的高度呢? vue中json可以循环、数组可以循环,既然ast语法书和vNode(虚拟dom)都可以渲染成真实dom, 那就可以使用一个json来渲染当前页面,就可以计算所有dom的高度, 最终生成一个二维数组来打印。

代码在下面的链接中,里面包括表格的封装、表格的截断的计算方式、文本的截断的计算方式等,兼容:ie10、chrome

 链接: https://pan.baidu.com/s/1_WY7mwvBlvc1woNZHrNV3A?pwd=xgs1 提取码: xgs1