vue嵌入PDF预览以及报错(Cannot read properties of undefined (reading ‘catch‘))解决

时间:2025-02-18 09:49:09

项目中需要用到PDF预览,查并尝试了很多种方法,使用了iframe,但是无法访问链接,可能是跨域问题,没有深究。使用了pdfjs,引入后模块报错,无法启动,可能是版本问题,最后选择了vue-pdf。

下载依赖:

npm install --save vue-pdf
引入:
import pdf from "vue-pdf";

使用(这里使用的是带有分页的,否则只会展示一页):

  components: {
    pdf,
  },
  <pdf ref="pdf" :src="url" v-for="i in numPages" :key="i" :page="i"> </pdf>
// 计算pdf页码总数
    getNumPages() {
      let loadingTask = ();
      
        .then((pdf) => {
           = ;
          (  )
        })
        .catch((err) => {
          ("pdf 加载失败", err);
        });
    },

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

Cannot read properties of undefined (reading 'catch')

经查阅,原来是版本问题,解决:在控制台输入一下命令

npm i pdfjs-dist@2.5.207

npm i vue-pdf@4.2.0