javascript - ionic 4 html2canvas

Question

我正在尝试将 HTML 捕获到 Ionic 4 应用程序中的图像。
我尝试使用 html2canvas ，但是，它不起作用并在控制台中显示此输出:


这是我的代码:

var element = document.getElementById('capture');
  html2canvas(element).then(canvas => {
    var imgData = canvas.toDataURL("image/png");
    this.socialSharing.share(null, null, imgData);
});

Answer 1

我有同样的问题。我设法通过将我的代码从 <ion-content> 中“修复”它标签。我的猜测是 html2canvas 不渲染阴影 DOM 元素(从 Ionic 4 开始， <ion-content> 就是这种情况)。

例如，这会输出一个空 Canvas :

<ion-content>
  <div id="capture">
    <h1>Test</h1>
  </div>
</ion-content>

但以下工作:

<div id="capture">
  <h1>Test</h1>
</div>

这不是一个真正的解决方案，但它对我的使用来说已经足够了......