安装
npm install vue-pdf -S 或 yarn add vue-pdf
使用(本地pdf放在static目录下)
<template>
<div class="super-flow-base-demo">
<pdf v-for="i in numPages"
:key="i"
:src="src"
:page="i"
style="display: inline-block; width: 100%; overflow: hidden; overflow-y: scroll;"
></pdf>
</div>
</template>
<script>
import pdf from 'vue-pdf'
let loadingTask = pdf.createLoadingTask('./../../static/pdfwwcc.pdf')
export default {
components: {
pdf
},
data() {
return {
src: loadingTask,
numPages: undefined,
};
},
created() {
},
mounted() {
// 获取总页数
this.src.promise.then(pdf => {
this.numPages = pdf.numPages;
});
},
methods: {
},
};
</script>
遇到的问题
npm i pdfjs-dist@2.5.207
npm i vue-pdf@4.2.0
或
yarn add pdfjs-dist@2.5.207
yarn add vue-pdf@4.2.0
修改pdf插件版本,重启就不报错了
ios使用vue-pdf会有白屏的bug
可以将vue-pdf替换[vue-pdf-sign]