React 移动端端 PDF 组件

fh 前端开发组提供

安装

yarn

yarn add fh-front-react-pdf

npm

npm i fh-front-react-pdf

使用

基本使用

import React from "react"
import ReactDom from "react-dom"
import MobilePDFReader from "fh-front-react-pdf"

export default () => {
    return (
        <div>
            <MobilePDFReader url="你的PDF文件地址" />
        </div>
    )
}

配置信息使用

import React from "react"
import ReactDom from "react-dom"
import MobilePDFReader from "fh-front-react-pdf"
const App = () => {
    return (
        <div>
            <MobilePDFReader
                url="你的PDF文件地址"
                defaultPage={1}
                onDocumentComplete={({ currentPage, totalPage }) => {
                    console.log(`当前页数:${currentPage}`)
                    console.log(`总页数:${totalPage}`)
                }}
                onPageChanged={currentPage => {
                    console.log(`当前第几页:${currentPage}`)
                }}
            />
        </div>
    )
}

ReactDom.render(<App />, document.getElementById("app"))

API

参数	说明	类型
defaultPage	起始页数	number
onDocumentComplete	PDF 加载完成回调	Function( {currentPage, totalPage} )
onPageChanged	PDF 页数改变回调	Function( currentPage )