vue-pdf插件

vue-pdf插件。这是一个基于PDF.js的Vue组件，用于在Vue应用中预览PDF文件；也可以用来实现搜索和高亮功能。

安装插件
npm install vue-pdf --save
在Vue组件中引入并使用插件（下面仅是预览功能）

<template>
  <div class="water-eport" v-loading="loading">
    <vuePdf :src="fileUrl" v-for="i in pageNum" :key="i" :page="i"></vuePdf>
  </div>
</template>
<script>
import vuePdf from 'vue-pdf';
export default {
  components: { vuePdf },
  props: {
    fileVisible: {
      type: Boolean,
      default: false
    },
    fileUrl: {
      type: String,
      default: ""
    },
  },
  mounted() {
    this.openDatail();
  },
  watch: {
    fileVisible: {
      handler(val) {
        this.openDatail();
      },
      deep: true,
      immediate: true
    },
  },
  methods: {
    openDatail() {
      if (this.fileVisible) {
        this.visible = true;
        this.loading = true;
        const loadingTask = vuePdf.createLoadingTask(this.fileUrl);
        loadingTask.promise.then(pdf => {
          this.loading = false;
          this.pageNum = pdf.numPages;
        }).catch(err => {
          this.loading = false;
          this.visible = false;
          this.$message.error('PDF加载失败')
        });
      }
    },
  }
}
</script>

vue-pdf-gitcode地址
pdf.js-中文文档