vue-pdf分页预览
生活随笔
收集整理的這篇文章主要介紹了
vue-pdf分页预览
小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
<div class="pdf" v-show="fileType === 'pdf'"><div style="height: 0.8rem;"></div><p class="arrow" style="font-size: 18px"><!-- // 上一頁(yè) --><span@click="changePdfPage(0)"class="turn":class="{grey: currentPage==1}"style="cursor: pointer;margin-left: 1rem;">上一頁(yè)</span>{{currentPage}} / {{pageCount}}<!-- // 下一頁(yè) --><span@click="changePdfPage(1)"class="turn":class="{grey: currentPage===pageCount}"style="cursor: pointer;">下一頁(yè)</span></p><pdfstyle="width: 90%":src="preUrl":page="currentPage"@num-pages="pageCount=$event"@page-loaded="currentPage=$event"@loaded="loadPdfHandler"></pdf></div>
methods: {
// 改變PDF頁(yè)碼,val傳過(guò)來(lái)區(qū)分上一頁(yè)下一頁(yè)的值,0上一頁(yè),1下一頁(yè)
changePdfPage(val) {
// console.log(val)
if (val === 0 && this.currentPage > 1) {
this.currentPage–
// console.log(this.currentPage)
}
if (val === 1 && this.currentPage < this.pageCount) {
this.currentPage++
// console.log(this.currentPage)
}
},
}
總結(jié)
以上是生活随笔為你收集整理的vue-pdf分页预览的全部?jī)?nèi)容,希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇: Django之ORM对数据库操作
- 下一篇: vue 生成PDF(A4标准PDF分页)