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