pdf转图片预览pdfh5插件

 

• 1.安装

npm install pdfh5

注意：默认下载的版本js会报错找不到该文件，我这边是切换了版本解决报错的（1.4.2版本）

2.导入

3.定义容器

<script>
  import axios from 'axios'
  import pdfh5 from 'pdfh5'
  import 'pdfh5/css/pdfh5.css'
  export default {
    data() {
      return {
        inputValue: '',
        pages: [], // 存放转换后的图片
        downLoadUrl: null,
        pdfh5: null
      }
    },
    mounted() {},
    methods: {
      submit() {
        this.callAPI(this.inputValue)
      },
      openPdf(url) {
        //url：PDF文件地址
        this.pdfh5 = new pdfh5('#previewPdf', {
          pdfurl: url,
          cMapUrl: url
        })
      },
      callAPI(inputValue) {
        axios
          .get(`请求地址+参数`)
          .then((res) => {
            this.downLoadUrl = res.data.data.url
            this.openPdf(this.downLoadUrl)
          })
          .catch((error) => {
            return error
          })
      }
    },
    handleButtonClick() {}
  }