又撸了个轮子

基于 PDF.js 在 Vue 中渲染 PDF 文件,支持文本渲染、懒加载、分页、缩放和打印功能。

鉴于市面上没有特别顺手的预览PDF插件,所以周末两天在家撸代码,终于搞出来一个可用的玩意。项目中使用的VUE-PDF,超过200页,直接在IE下卡死,我这个插件,500页PDF,也可以做到丝滑般的使用体验(自卖自夸)!

又撸了个轮子

可以看到,只加载了前两页,后面的12页全部都没有渲染。

Install

npm install cafe-pdf --save

Use

import cafePdf from 'cafe-pdf'
import 'cafe-pdf/package/cafe-pdf.css'
Vue.use(cafePdf)

Example

Demo:http://demo.const.team/pdf/

注意:使用打印功能,需配合打印样式。

Attributes

参数说明类型可选值默认值
srcpdf地址string
useOnlyCssZoom缩放模式为CSSbooleanfalse
autoWidth初始化时是否将pdf缩放到容器宽度booleanfalse
textLayerMode是否为文本模式渲染,0使用canvas,1使用文本模式number0/10

Events

事件名说明参数
on-loaded初始化事件页码总数
on-scroll滚动pdf时触发当前页数

Methods

方法名说明参数
zoom缩放缩放比例:auto
changePagePDF翻页页码
printPdf打印整个PDFscale

Slot

name说明
header头部插槽。
footer尾部插槽。

已经开源,给个星星呗!

又撸了个轮子
Owner:
Updated:1970-01-01 08:00
Watch:
Star:
Fork:

添加新评论