vue中pdf预览，报错（Cannot read properties of undefined (reading ‘catch‘)）解决

npm install --save vue-pdf

文件中引入：

import pdf from "vue-pdf";

<pdf ref="pdf" :src="url" v-for="i in numPages" :key="i" :page="i"> </pdf>

data(){
   return{
       url:'',
       numPages:1
   }
},
components: {
    pdf,
},

getNumPages(url) {
   let loadingTask = pdf.createLoadingTask(url)
   loadingTask.promise.then(Pdf => {
       this.url = loadingTask
       this.numPages = Pdf.numPages
   }).catch(() => {
       console.error('pdf加载失败')
   })
},

调用： 

this.getNumPages(xx.pdf)

注意：启动项目后，PDF正常展示但是会报错：

Cannot read properties of undefined (reading 'catch')

据说是版本问题。

解决方法：

1.

npm i pdfjs-dist@2.5.207

npm i vue-pdf@4.2.0

2.在node_modules中找到vue-pdf，src下的pdfjsWrapper.js。将

if ( pdfRender !== null ) {
   if ( canceling )
       return;
   canceling = true;
   pdfRender.cancel().catch(function(err) {
       emitEvent('error', err);
   });
   return;
}

修改为：

if ( pdfRender !== null ) {
   if ( canceling )
      return;
   canceling = true;
   pdfRender.cancel();
   return;
}