html2canvas+jspdf文字整体样式向下偏移

最新推荐文章于 2024-08-20 11:35:04 发布

喵(* ￣3)(ε￣ *)

最新推荐文章于 2024-08-20 11:35:04 发布

阅读量689

点赞数 7

分类专栏： vue css 文章标签： vue css pdf javascript

本文链接：https://blog.csdn.net/sai_gao/article/details/140155898

版权

vue 同时被 2 个专栏收录

6 篇文章 0 订阅

订阅专栏

css

1 篇文章 0 订阅

订阅专栏

html2canvas+jspdf文字整体样式向下偏移

csdn搜不出解决方案，每个人需要导出的页面不一样。

像什么改版本号啊为1.0.0啊根本没用，2024以后都不用试了，除非组件有更新。
我的版本是

    "html2canvas": "^1.4.1",
    "jspdf": "^2.5.1",

去原库的issue里找到了大佬的解决方法。

初步判断是tailwind的问题：生成的截图文字整体向下偏移设置scroll-Y: 0 无效 #2363

底下评论有人建议的解决方法原链接：Since html2canvas append div tag to body to get some metrics, we can do the following:

const install = () => {
  
  const style = document.createElement('style')
  document.head.appendChild(style)
  style.sheet?.insertRule(
    'body > div:last-child img { display: inline-block; }',
  )
  html2Canvas(document.querySelector('#pdfPage') as HTMLDivElement, {
    allowTaint: true,
    useCORS: true,
    scale: 4, // 按比例增加分辨率
  }).then((canvas: any) => {
    style.remove()
    
  })
}