首先要安装 vue-pdfa

npm安装：  npm install --save vue-pdf

<template>

       <el-dialog :visible.sync="dialogFormVisible2" style="width:120%;height:100%;margin-left:-100px"
            @close='closeDialog'>
            <div style="text-align: center;font-size: 16px;">第{ {this.myfile.pdfIndex+1}}页</div>
            <div style="margin-bottom: 15px; text-align: right">
                <el-button type="primary" size="small" @click.stop="previousPage">
                    上一页
                </el-button>
                <el-button type="primary" size="small" @click.stop="nextPage">
                    下一页
                </el-button>
            </div>
            <div>
                <pdf :src="src" style="display: inline-block; width: 100%"></pdf>
            </div>
        </el-dialog>

</template>

<script>

import {
        getPdf,
        getPdfIndex
    } from '@/api/scoremanage'

import pdf from 'vue-pdf';

export default {
data() {
        return {
        src: null,

         myfile: {

             //获取pdf后端所需要传的字段
          },
         myfiles: {

            //获取pdf数量后端所需要传的字段
           },
      }
 },

methods:{

//查看pdf
 check_suggest(row) {

       (获取后端所需要传的字段值,myfile,myfiles)

      getPdf(this.myfile).then(response => {
                console.log(response);
         })
       this.src = '（https://api.ahutwyc.tech:9000）请求数据的地址/api/student/getPdf?projectName=' + this.myfile.projectName +
                    '&gradeCode=' + this.myfile.gradeCode + '&level=' + this.myfile.level + '&sex=' + this.myfile.sex +
                    '&pdfIndex=' + this.myfile.pdfIndex + '&schoolId=' + this.myfile.schoolId;
            }

 }，

//上一页
  previousPage() {
                this.src = ''

           //向后端获取总pdf数量
                getPdfIndex(this.myfiles).then(res => {
                    this.data = res.data
                })
                if (this.myfile.pdfIndex > 0) {
                    this.myfile.pdfIndex = this.myfile.pdfIndex - 1
                } else {
                    this.myfile.pdfIndex = this.data.length - 1
                }

               getPdf(this.myfile).then(response => {
                         console.log(response);
                   })

                this.src = '（https://api.ahutwyc.tech:9000）请求数据的地址/api/student/getPdf?projectName=' + this.myfile.projectName +
                    '&gradeCode=' + this.myfile.gradeCode + '&level=' + this.myfile.level + '&sex=' + this.myfile.sex +
                    '&pdfIndex=' + this.myfile.pdfIndex + '&schoolId=' + this.myfile.schoolId;
            },
//下一页
nextPage() {
                this.src = ''
                getPdfIndex(this.myfiles).then(res => {
                    this.data = res.data
                })
                if (this.myfile.pdfIndex + 1 >= this.data.length) {
                    this.myfile.pdfIndex = 0
                } else {
                    this.myfile.pdfIndex = this.myfile.pdfIndex + 1
                }

               getPdf(this.myfile).then(response => {
                    console.log(response);
                })

                this.src = '（https://api.ahutwyc.tech:9000）请求数据的地址/api/student/getPdf?projectName=' + this.myfile.projectName +
                    '&gradeCode=' + this.myfile.gradeCode + '&level=' + this.myfile.level + '&sex=' + this.myfile.sex +
                    '&pdfIndex=' + this.myfile.pdfIndex + '&schoolId=' + this.myfile.schoolId;
            }

    }

}

</script>