html2canvas长截图不全，底部内容空白

前言

采用html2canvas做长截图，截图内容上面部分显示完好，底部大片内容空白，但是图片的高度是正确的。。。

正文

思路1：图片没有渲染就开始截图了，于是我加延时操作，问题依然存在。代码如下：

setTimeout((cb) => {
  const domObj = this.$refs.cont;
  html2Canvas(domObj,).then((canvas) => {          
    var pageData = canvas.toDataURL("image/png");
  });
}, 13000);

思路2 ：内容过多，截不下来。嘿一查还真是!我用的chrome浏览器

这不巧了吗，然而不可能删减内容啊，只能牺牲下清晰度，调整下分辨率 ，刚好人家提供了配置，html2canvas完整配置摸我：chrome浏览器默认缩放比率为2，那把它适当调小点，问题解决

devicePixelRatio的解释摸我

代码如下：

html2Canvas(domObj,{
  scale: 1
}).then((canvas) => {
  var pageData = canvas.toDataURL("image/png");
});

总结

关于html2canvas插件截图的问题种类很多，网上都有很多资料，具体还看自己的问题