ID 为 pdfViewerId 的div内部必须在包含一层 <div> 否则会报错,如一下代码:
<div ref="pdfViewer" id="pdfViewerId">
<!--必须在包含一层div,否则报错-->
<div></div>
</div>
否则,以下代码会报错 :
const pdfViewer = new PDFViewer({
container: _this.$refs.pdfViewer
});
import '../../utils/turn/jquery.min.1.7.js';
import pdfjsLib from 'pdfjs-dist/build/pdf'
import { PDFViewer, PDFPageView } from 'pdfjs-dist/web/pdf_viewer';
import workerSrc from 'pdfjs-dist/build/pdf.worker.entry';
pdfjsLib.GlobalWorkerOptions.workerSrc = workerSrc;
export default {
name: "reader-pdf",
props: {
path: {
type:String,
default: ''
},
},
mounted() {
const _this = this;
const _doc = document.getElementById("pdfViewerId");
const pdfViewer = new PDFViewer({
container: _this.$refs.pdfViewer
});
pdfjsLib.getDocument('/static/reader-01.pdf').promise.then(pdf => {
pdfViewer.setDocument(pdf);
const pageView = new PDFPageView({
container: _this.$refs.pdfViewer,
id: 1,
scale: 1,
defaultViewport :{}
});
}).catch(error => {
console.log(error);
});
}
};
以上的坑只是一 pdfjs-dist v2.2.228版本为举例