admin管理员组

文章数量:1649183

<template>
  <div id="pdf" class="pdf">
    <div class="title">
      <div>PDF阅读器</div>
      <div>{
   {
   currentPage||0}}/{
   {
   pageCount||0}}</div>
      <div>
        <!-- 上一页、下一页 -->
        <div class="right-btn">
          <!-- 输入页码 -->
          <!-- <div class="pageNum">
                    <input v-model.number="currentPage"
                            type="number"
                            class="inputNumber"
                            @input="inputEvent()"> / {
   {
   pageCount}}
                    </div> -->
          <div @click="changePdfPage('first')" class="turn">
            首页
          </div>
          <!-- 在按钮不符合条件时禁用 -->
          <div @click="changePdfPage('pre')" class="turn-btn"
            :style="currentPage===1?'cursor: not-allowed;color:#999;':''">
            上一页
          </div>
          <div @click="changePdfPage('next')" class="turn-btn"
            :style="currentPage===pageCount?'cursor: not-allowed;color:#999;':''">
            下一页
          </div>
          <div @click="changePdfPage('last')" class="turn">
            尾页
          </div>
        </div>
      </div>
    </div>
    <div class="pdfArea">
      <pdf :src="src" ref="pdf" v-show="loadedRatio===1" :page="currentPage" @num-pages="pageCount=$event"
        @progress="loadedRatio = $event" @page-loaded="currentPage=$event" @loaded="loadPdfHandler"
        @link-clicked="currentPage = $event" style="display: inline-block;width:100%" id="pdfID"><

本文标签： 组件vuePDF

版权声明：本文标题：vue-pdf组件 内容由热心网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：https://m.elefans.com/dianzi/1729505348a1203560.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。