Vue中实现pdf文件预览功能

 写在前面：

实现的功能就是点击预览按钮，弹出对话框在线预览pdf文件

 

 

 实现此功能的前提是需要在Vue项目中安装组件vue-pdf，

在终端命令行输入运行如下语句：

npm install --save vue-json-excel vue-pdf

安装完组件后，首先在要使用的页面中引入pdf组件

<script>
import pdf from 'vue-pdf'
export default {
  components: {
    pdf
  },
  data () {
    return {
      pdfUrl: '',
      src: '',
    }
  }
}

因为我们是前后端分离的vue项目，pdf的在服务器的位置后台已经返给我了

 在