vue-pdf

<template>
  
          <pdf v-for="i in numPages" :key="i" :src="pdfUrl" :page="i">
          </pdf>
          
</template>

<script>
import pdf from 'vue-pdf';
export default {
  name: 'pdfCom',
  components: { pdf },
  props: {
    pdfName: '',
  },
  data() {
    return {
      numPages: 1, // pdf文件总页数
      // src: "/fec/bookshelf/poc.pdf#toolbar=0", // pdf文件地址
      src: '/fec/bookshelf/poc.pdf', // pdf文件地址  //静态目录
      pdfUrl: null,
    };
  },
  mounted() {
    this.pdfTask(this.src);
  },
  methods: {
    closePdf() {
      this.$emit('pdfHandle', false);
    },
    pdfTask(src) {
      var self = this;
      var loadingTask = pdf.createLoadingTask(src);
      loadingTask.promise.then((pdf) => {
        self.pdfUrl = loadingTask;
        self.numPages = pdf.numPages;
      });
    },
  },
};
</script>

<style lang="less" scoped>

</style>