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

作者站长头像
站长
· 阅读数 15

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

正常的

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

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

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

代码:

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
}

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

跪求大佬。。。。。

回复
1个回答
avatar
test
2024-07-13
printJS({
  printable: imgUrl,
  type: 'image',
  style: `@media print { @page {size: auto; margin: 0; } body{margin:0 5px}}`
})
回复
likes
适合作为回答的
  • 经过验证的有效解决办法
  • 自己的经验指引,对解决问题有帮助
  • 遵循 Markdown 语法排版,代码语义正确
不该作为回答的
  • 询问内容细节或回复楼层
  • 与题目无关的内容
  • “赞”“顶”“同问”“看手册”“解决了没”等毫无意义的内容