react-pdf插件实现pdf预览功能

安装react-pdf插件
npm install react-pdf
引入依赖包
import { Document, Page, pdfjs } from 'react-pdf'

依赖包下载下来默认是不展示电子签章, 引用一个静态的pdf.worker.js,注释里面隐藏的电子签章功能

pdfjs.GlobalWorkerOptions.workerSrc = `//cdnjs.cloudflare.com/ajax/libs/pdf.js/${pdfjs.version}/pdf.worker.js`

js渲染

<Document
//文件路径,
 file="somefile.pdf"
//加载成功调用 
onLoadSuccess={onDocumentLoadSuccess} 
//加载失败调用 
onLoadError={onDocumentLoadFail} 
//加载提示 
  loading={<div>Please wait!</div>}> 
//页码显示,翻页设置修改对应page即可 
  <Page pageNumber={pageNumber} /> 
</Document>

react-pdf 点击进入官方文档

参考文档:https://blog.csdn.net/gxl5201314lele/article/details/108407753

 

posted on 2021-01-14 15:45  blue_hl  阅读(5656)  评论(0编辑  收藏  举报