页面dom

<pdf v-for=”i in numPages” :key=”i” :page=”i” :src=”pdfSrc”>

引用vue-pdf

  import pdf from ‘vue-pdf’

//data定义

data(){

        return{

                pdfSrc: ”,

                numPages: undefined,

        }

}

// 初始化获取pdf文件

      getPdfCode(alikey) {

        let that = this;

        let formData = new FormData();

        formData.append(“参数名称”, 参数);

        request.post(“”, formData, {

            headers: {

              “Content-Type”: “application/vnd.openxmlformats-officedocument.spreadsheetml.sheet”

            },

            responseType: ‘blob’ //设置响应的数据类型为一个包含二进制数据的 Blob 对象，必须设置！！！

          })

          .then(response => {

            that.pdfSrc = that.getObjectURL(response.data);

            that.pdfSrc = pdf.createLoadingTask(that.pdfSrc);

            that.pdfSrc.promise.then(pdf => {

              that.numPages = pdf.numPages

            });

          }).catch(function (error) {

            console.log(error);

          });

      },

// 将返回的流数据转换为url

      getObjectURL(file) {

        let url = null;

        if (window.createObjectURL != undefined) { // basic

          url = window.createObjectURL(file);

        } else if (window.webkitURL != undefined) { // webkit or chrome

          try {

            url = window.webkitURL.createObjectURL(file);

          } catch (error) {

          }

        } else if (window.URL != undefined) { // mozilla(firefox)

          try {

            url = window.URL.createObjectURL(file);

          } catch (error) {

          }

        }

        return url;

      }