vue-pdf-signature在加载pdf，浏览器放大缩小报错RenderingCancelledException：Rendering cancelled的解决办法-优快云博客

在项目中使用vue-pdf-signature时，用户反馈在浏览器缩放时PDF预览加载失败。经排查发现，高度设置为auto可能导致问题，将height固定值后解决了该问题，推测高度auto可能影响了组件渲染过程。

使用vue-pdf-signature 报错RenderingCancelledException：Rendering cancelled

项目中使用了vue-pdf-signature组件一直没发现什么问题，突然用户反馈，在浏览器放大或者缩小的时候，pdf预览加载不出来。
我就先排查，结果发现，在pdf加载的过程中，报了如下错误：
在这里插入图片描述
前端代码如下：

<div style="overflow-y: auto; height: 100%">
        <pdf
            ref="pdf"
            class="pdf-preview"
            :src="pdfSrc"
            v-for="i in numPages"
            :key="i"
            :page="i"
            @num-pages="pageCount = $event"
        ></pdf>
      </div>

看着代码没有问题。
然后从网上查阅资料，发现也有一些人遇到类似的问题，不过尝试了加定时器方法，没有用。
同时，我也发现，这个错误是在放大或者缩小到特定比例下才会触发这个bug，换成不同的pdf,加载又没有这个bug,这个就可能是，觉得这个bug可能是和样式有关。
我找到了一个文章提到可能是和pdf高度有关。原文章连接
于是我开始排查，发现代码了pdf设置了height：auto。
可能问题就出在这，我把pdf的高度修改为具体值，问题解决。

.pdf-preview {
  width: 100%;
  height: 1450px;
}

.pdf-preview canvas {
  height: 100% !important;
}

猜测：这个可能是这个高度auto在加载中影响了pdf组件，具体机制没有时间详细研究，先记下来，后面有时间再详细研究。