vue-pdf 添加一个放大缩小功能

要给vue-pdf添加一个放大缩小功能，你可以使用PDF.js库提供的API来实现。下面是一个简单的实现方式：

1. 首先，在你的Vue组件中引入vue-pdf和pdf.js库：

import VuePdf from 'vue-pdf'
import pdfjsLib from 'pdfjs-dist'

2. 然后，在你的模板中添加一个vue-pdf组件，并在mounted钩子函数中获取PDF文档的总页数：

<template>
  <div>
    <vue-pdf :src="pdfUrl" ref="pdfViewer"></vue-pdf>
    <button @click="zoomIn">放大</button>
    <button @click="zoomOut">缩小</button>
  </div>
</template>

<script>
export default {
  components: {
    VuePdf
  },
  data() {
    return {
      pdfUrl: 'your-pdf-file.pdf',
      pdfTotalPages: 0,
      pdfScale: 1.0 // 初始缩放比例为1.0
    }
  },
  mounted() {
    this.$refs.pdfViewer.pdfjsLib = pdfjsLib
    this.$refs.pdfViewer.getPageNumber().then(num => {
      this.pdfTotalPages = num
    })
  },
  methods: {
    zoomIn() {
      if (this.pdfScale < 2.0) {
        this.pdfScale += 0.1 // 每次放大0.1倍
        this.$refs.pdfViewer.setScale(this.pdfScale)
      }
    },
    zoomOut() {
      if (this.pdfScale > 0.5) {
        this.pdfScale -= 0.1 // 每次缩小0.1倍
        this.$refs.pdfViewer.setScale(this.pdfScale)
      }
    }
  }
}
</script>

3. 最后，为放大和缩小按钮绑定点击事件，并在方法中调用vue-pdf提供的setScale方法来实现缩放。

注意，vue-pdf的setScale方法接受一个浮点数作为缩放比例，1.0表示原始大小，2.0表示放大2倍，0.5表示缩小一半。

这样，你就可以给vue-pdf添加一个简单的放大缩小功能了。