如何使用react-pdf从PDF文件中获取页数？

React-PDF是一个用于在React应用程序中显示PDF文件的库。要从PDF文件中获取页数，可以使用React-PDF提供的Document组件和pdfjs.GlobalWorkerOptions.workerSrc属性。

首先，确保已经安装了React-PDF库。可以使用以下命令进行安装：

npm install react-pdf

接下来，在React组件中导入所需的库和组件：

import React from 'react';
import { Document, pdfjs } from 'react-pdf';

然后，设置pdfjs.GlobalWorkerOptions.workerSrc属性，指定PDF.js的工作线程脚本的路径。可以使用以下代码：

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

接下来，创建一个React组件，并在其中使用Document组件来加载PDF文件。通过设置onLoadSuccess属性，可以在PDF文件加载成功后执行回调函数。在回调函数中，可以获取PDF文件的页数。

class PDFViewer extends React.Component {
  state = {
    numPages: null,
  };

  onDocumentLoadSuccess = ({ numPages }) => {
    this.setState({ numPages });
  };

  render() {
    const { numPages } = this.state;

    return (
      <div>
        <Document
          file="path/to/your/pdf/file.pdf"
          onLoadSuccess={this.onDocumentLoadSuccess}
        >
          {/* PDF content */}
        </Document>
        <p>Number of pages: {numPages}</p>
      </div>
    );
  }
}

在上面的代码中，将file属性设置为要加载的PDF文件的路径。在onDocumentLoadSuccess回调函数中，通过解构赋值获取numPages属性，并将其存储在组件的状态中。然后，可以在页面上显示页数。

请注意，上述代码中的path/to/your/pdf/file.pdf应替换为实际的PDF文件路径。

推荐的腾讯云相关产品：腾讯云对象存储（COS）