为什么使用print.js打印一页以上就有空白页?

dom转成图片再使用print.js打印,一旦打印2页或以上就有空白页
检测过图片是正常的,打印的预览就不正常了。

正常的

image.png

加了几行后,超过了一页,第一页就是空白页

image.png

代码:

toImg() {
      const dom = document.querySelector('.printContent')
      dom.style.height = 'auto'
      dom.style.overflow = 'visible'
      // 转图片打印
      html2canvas(dom, {
        backgroundColor: null,
        useCORS: true,
        windowHeight: document.body.scrollHeight
      }).then(canvas => {
        const url = canvas.toDataURL()
        const styles = '@page {size: auto;}'
        printJS({
          printable: url,
          type: 'image',
          documentTitle: '文档模板',
          style: styles
        })
      })
    }

图片没问题,说明dom没问题,就是打印出了问题,网上都说调margin和height,但在这里好像没用。

尝试使用@page的margin,更加证明样式没问题。

@page {
    margin-top: -200px
}

image.png

跪求大佬。。。。。

阅读 7.1k
2 个回答
✓ 已被采纳
printJS({
  printable: imgUrl,
  type: 'image',
  style: `@media print { @page {size: auto; margin: 0; } body{margin:0 5px}}`
})

table 打印确实会有空白页的问题,试着给 table 的父级 div 加一个透明的 border 试试

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题