vue3项目使用pdf.js插件实现：搜索高亮、修改pdf.js显示的页码、向pdf.js传值、控制搜索、处理接口文件流

在Vue 3项目中使用pdf.js实现搜索高亮、自定义显示页码、向pdf.js传值以及控制其行为，可以通过以下步骤来实现：

1. 安装pdf.js依赖：

npm install pdfjs-dist

2. 在Vue组件中引入pdf.js相关模块：

import pdfjsLib from 'pdfjs-dist/build/pdf';
import 'pdfjs-dist/web/pdf_viewer.css';
 
pdfjsLib.GlobalWorkerOptions.workerSrc = '//mozilla.github.io/pdf.js/build/pdf.worker.js';

3. 创建一个canvas元素来渲染PDF页面：

<template>
  <div>
    <canvas ref="pdfCanvas"></canvas>
  </div>
</template>

4. 实现PDF渲染和搜索高亮功能：

<script setup>
import { ref, onMounted, watch } from 'vue';
import pdfjsLib from 'pdfjs-dist/build/pdf';
import 'pdfjs-dist/web/pdf_viewer.css';
 
pdfjsLib.GlobalWorkerOptions.workerSrc = '//mozilla.github.io/pdf.js/build/pdf.worker.js';
 
const pdfCanvas = ref(null);
const pdfPath = 'path/to/your/pdf/file.pdf';
const currentPageNum = ref(1);
const searchText = ref('');
 
onMounted(async () => {
  const pdf = await pdfjsLib.getDocument(pdfPath).promise;
  renderPage(pdf, currentPageNum.value);
});
 
watch(currentPageNum, (newPageNum, oldPageNum) => {
  if (newPageNum !== oldPageNum) {
    renderPage(pdf, newPageNum);
  }
});
 
watch(searchText, (newText, oldText) => {
  if (newText !== oldText) {
    highlightText(newText, currentPageNum.value);
  }
});
 
function renderPage(pdf, pageNum) {
  pdf.getPage(pageNum).then(page => {
    const viewport = page.getViewport({ scale: 1.5 });
    const canvas = pdfCanvas.value;
    const context = canvas.getContext('2d');
    canvas.height = viewport.height;
    canvas.width = viewport.width;
    const renderContext = {
      canvasContext: context,
      viewport: viewport
    };
    page.render(renderContext).promise.then(() => {
      highlightText(searchText.value, pageNum);
    });
  });
}
 
function highlightText(text, pageNum) {
  // Implement text highlighting here
}
</script>

5. 在上述代码中，renderPage函数负责渲染指定页码的PDF页面，highlightText函数负责在页面上搜索并高亮显示文本。
6. 为了控制PDF的行为，你可以添加额外的方法，如前进、后退页面，调整缩放比例等。

请注意，上述代码示例提供了实现搜索高亮和页面渲染的基本框架。实际的高亮实现将取决于pdf.js的API和渲染细节。

以上代码未包含实际的高亮逻辑，因为这部分可能会相当复杂，并且会根据项目的具体需求而变化。高亮文本通常需要使用pdf.js的TextLayerBuilder类，并可能需要自定义渲染逻辑以实现高亮效果。