pbl-teacher-table/src/components/pages/demoPdf.vue

<template>
  <div class="pdfBody">
    <Pdf2 ref="pdf" @getPageTotal="getPageTotal" :getPage="getPage"></Pdf2>
    <div class="btnbox">
      <el-button type="primary" @click="nextPage">下一页</el-button>
      <el-button type="primary" @click="prePage">上一页</el-button>
    </div>
  </div>
</template>

<script>
import Pdf2 from "./components/pdf2";
export default {
  components: {
    Pdf2,
  },
  data() {
    return {
      pageTotal: 0, //总页数
      page: 0, //第几页
    };
  },
  methods: {
    getPageTotal(total) {
      this.pageTotal = total;
    },
    getPage(page) {
      this.page = page;
      console.log(page);
    },
    nextPage(){
        this.$refs.pdf.nextPage();
    },
    prePage(){
        this.$refs.pdf.prePage();
    }
  },
};
</script>

<style>
.pdfBody {
  height: 100%;
  width: 100%;
  position: relative;
}
.btnbox {
  position: absolute;
  top: 0;
}
</style>