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

1,568 阅读1分钟

贴贴之前写的笔记

安装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 点击进入官方文档

参考文档:blog.csdn.net/gxl5201314l…