9***@qq.com
9***@qq.com
  • 发布:2025-02-17 15:57
  • 更新:2025-02-26 23:01
  • 阅读:100

html2canvas H5截图样式问题

分类:uni-app

uniapp 的H5项目,左边是网页内容,右边是截图结果。 我用正常vue3项目截图都是正常的,但是这个项目不知道为什么,截出来这个玩意,谁能帮忙解答一下。

const downLoad = async () => {  
  console.log(document.querySelector('#capture22'));  
  html2canvas(document.querySelector('#capture22'), {  
    useCORS: false,  
    height: 400,  
    width: 750,  
    allowTaint: false,  
  }).then(canvas => {  
    // 将生成的 Canvas 显示在页面上  
    const link = document.createElement('a');  
    link.download = 'screenshot.png';  
    link.href = canvas.toDataURL('image/png');  
    link.click();  
  });  
}

<div id="capture" style="padding: 10px; background: #f5da55; margin-bottom: 20px;">
<h4>Hello world!</h4>
<p>这是一个需要截图的内容区域2222ykl3333999999999。</p>
</div>
我html 用div , view 都不行。

2025-02-17 15:57 负责人:无 分享
已邀请:
杨杨得亿

杨杨得亿 - 这个人很懒,什么都没有留下~

是不是 选择dom时候没有传入this
或者提供能复现问题的完成示例

  • 9***@qq.com (作者)

    我vue3 的,没有this吧, 你说的this是哪个this?

    2025-02-17 16:15

杨杨得亿

杨杨得亿 - 这个人很懒,什么都没有留下~

vue3当然没有this,可以上传一下可以复现的demo,帮你看下

  • 9***@qq.com (作者)

    一个项目,没法上传吧,你有uniapp项目吗,引入html2canvas 随便截一个dom试试

    2025-02-17 16:34

  • 杨杨得亿

    回复 9***@qq.com: 那行,等我有空创建一个空项目试试

    2025-02-17 16:43

  • 9***@qq.com (作者)

    你是不是在刷评论刷热门啊,回答的也很奇怪。

    2025-02-17 18:57

  • 杨杨得亿

    回复 9***@qq.com: 想多了,我就是想告诉你 ,我是帮你解决问题,有问题需要你上传问题demo,没有义务为了你在我的项目里下载一个html2canvas 或新创建一个项目,这样会污染我的工程和浪费我的时间,求人就要拿出求人的态度,OK?

    2025-02-18 08:12

  • 9***@qq.com (作者)

    回复 杨杨得亿: 之前没看到,你爱看不看,没求你好吗,不是说你回答问题就牛逼。 动不动上传demo,不如我用其他方案。

    2025-03-12 17:35

  • 杨杨得亿

    回复 9***@qq.com: 你不传demo,我看你吗

    2025-03-13 08:01

王大胖

王大胖

css属性不兼容问题,html2canvas的一些样式不兼容的,具体啥不兼容,需要你自己查找一下文档了

要回复问题请先登录注册