vue-pdf vue中导入文件 并预览

 暂时 是 导入后 根据文件流 预览

之后上传后台哪url地址应该就是<pdf :src="url" 

创建 参考 https://www.cnblogs.com/mizuki-vone/p/16379069.html

多页<pdf v-for="i in pageNum" :key="i" :src="file" :page="i"></pdf>
  </div>

import pdf from 'vue-pdf'

 components: {
    pdf
  },

file: "/pdf/test.pdf",
 pageNum: 1,

 mounted() {
   this.getPageNum()
  },
  methods: {
    //pdf
    getPageNum () {
      let loadingTask = pdf.createLoadingTask(this.file)
      loadingTask.promise.then(pdf => {
        this.pageNum = pdf.numPages
      }).catch(err => {
        console.error('pdf加载失败', err);
      })
    },

 报错 Invalid PDF structure.

写了 /public/xxx.pdf，并不行，还是显示未能加载PDF文档，但是路径好像也没有问题啊，最后才发现，原来写在 /pubilc目录下的文件不需要加上 /public，直接在src中写/xxx.pdf即可

报错 ：“TypeError:无法读取未定义的财产（读取'catch'）”

 Error in v-on handler: "TypeError: Cannot read properties of undefined (reading 'catch')"

found in

---> <ResizeSensor> at node_modules/vue-resize-sensor/src/resize-sensor.vue
       <Pdf> at node_modules/vue-pdf/src/vuePdfNoSss.vue
         <HelloWorld> at src/components/HelloWorld.vue

解决方法：

在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;
}

 7 typeerror:(0,_schemautils.default) is not  a function @./node_modules/css-loader/dist

我在项目里手动加入vue-pdf 产生了这问题

方法1 

方法2 我是报error in ./node_modules/element-ui/lib/theme-chalk/fonts/element-icons.woff 

syntax Error : typeError:(0,_sc....

我试了试 @./node_modules/css-loader/dist   更新css-loader  url-loader...

虽然能运行了，但图片 invalid prop:type check failed for prop "src"Expected String with value "[object Module]",got Module 

搜索解决方法，改esModule:false, 但我的问题没解决，暂时搁置，我搞别的去

vue.config.js

loader:'xxx',
options:{

esModule:false,
name:'[path][name].[ext]
}

 11 pdf

invalid PDF structurn
indexing all PDF objects
Bad  FCHECK in flate stream :120,194

第一个 有这个代码 ，报错，如何将它删掉

删掉后报错 indexing all PDF objects
Bad  FCHECK in flate stream :120,194

参考第二个 看了看 区别在let file = new Blob([data],{type:'application/pdf;chartset=utf-8'})

 又报 Name token is longer than allowed by the spec:286

反正最后 我直接保存的是 Blob （flie) ，没转换了，

应该在以xx格式读取文件 获取 result 时发生了错误吧

参考vue-pdf 通过文件流预览pdf文件_vue-pdf 文件流_逩跑鍀小学生的博客-CSDN博客

      vue处理PDF文档流数据并实现PDF的预览以及打印功能以及处理PDF打印乱码问题_vue-pdf 文件流_木屋x的博客-CSDN博客