要在React.js应用程序中提取PDF的内容，您可以使用pdfjs-dist库，该库提供了处理PDF文件的功能。下面是一个如何实现此目标的示例：
1.安装所需的软件包：首先使用npm或yarn安装pdfjs-dist包：

npm install pdfjs-dist

1.在组件中导入所需的模块：

import { Document, Page } from 'react-pdf/dist/esm/entry.webpack';
import pdfjs from 'pdfjs-dist';

1.配置PDF.js库：在加载PDF文件之前，您需要通过设置worker文件的正确路径来配置pdfjs库。您可以在将处理PDF文件的组件中执行此操作：

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

1.从PDF加载和提取内容：在组件中，可以加载PDF文件并提取其内容。下面是一个使用函数组件和钩子的例子：

import React, { useState } from 'react';

const PdfExtractor = () => {
  const [numPages, setNumPages] = useState(null);
  const [pdfText, setPdfText] = useState('');

  const onDocumentLoadSuccess = ({ numPages }) => {
    setNumPages(numPages);

    // Extract text from each page
    const textPromises = [];
    for (let i = 1; i <= numPages; i++) {
      textPromises.push(
        pdfjs.getDocument({ url: 'path/to/pdf/file.pdf' })
          .then((pdf) => pdf.getPage(i))
          .then((page) => page.getTextContent())
          .then((textContent) => {
            const pageText = textContent.items.map((item) => item.str).join(' ');
            return pageText;
          })
      );
    }

    Promise.all(textPromises)
      .then((pageTexts) => {
        const extractedText = pageTexts.join(' ');
        setPdfText(extractedText);
      })
      .catch((error) => console.error('Failed to extract PDF text:', error));
  };

  return (
    <div>
      <Document
        file="path/to/pdf/file.pdf"
        onLoadSuccess={onDocumentLoadSuccess}
      >
        {Array.from(new Array(numPages), (el, index) => (
          <Page key={`page_${index + 1}`} pageNumber={index + 1} />
        ))}
      </Document>
      <div>{pdfText}</div>
    </div>
  );
};

export default PdfExtractor;

在上面的示例中，将'path/to/pdf/file.pdf'替换为PDF文件的实际路径或URL。
onDocumentLoadSuccess函数在PDF成功加载时调用。它从PDF的每个页面中提取文本内容并将它们连接在一起。
提取的文本存储在pdfText状态变量中，该变量可以在组件中呈现或根据需要使用。
react-pdf中的Document组件用于呈现PDF页面，Page组件表示每个单独的页面。
通过以下步骤，您可以使用pdfjs-dist库在React.js应用程序中提取PDF的内容。
更新：
要允许使用<input>组件选择文件，可以执行以下操作：

import { useState } from 'react';
import { PDFDocument } from 'pdfjs-dist';

function YourComponent() {
  const [pdfContent, setPdfContent] = useState('');

  const handleFileChange = async (event) => {
    const file = event.target.files[0];
    const reader = new FileReader();

    reader.onload = async (e) => {
      const contents = e.target.result;
      const pdf = await PDFDocument.load(contents);
      const pages = pdf.getPages();
      let extractedText = '';

      for (const page of pages) {
        const textContent = await page.getTextContent();
        const pageText = textContent.items.map((item) => item.str).join(' ');
        extractedText += pageText;
      }

      setPdfContent(extractedText);
    };

    reader.readAsArrayBuffer(file);
  };

  return (
    <div>
      <input type="file" onChange={handleFileChange} />
      <div>{pdfContent}</div>
    </div>
  );
}

export default YourComponent;