npmjs pdf视图

import { Viewer, Worker } from '@react-pdf-viewer/core';

import { defaultLayoutPlugin } from '@react-pdf-viewer/default-layout';

// 引入核心样式

import '@react-pdf-viewer/core/lib/styles/index.css';

import '@react-pdf-viewer/default-layout/lib/styles/index.css';

function PdfView({

  fileUrl = 'http://175.102.19.158:9001/standalloc/r6oK2yARlHVlX7ZIYtxX0-C语言程序设计（第五版） -- 谭浩强 -- 计算机(1).pdf',

}: {

  fileUrl: string;

}) {

  // 初始化默认布局插件，自带完整工具栏

  const defaultLayoutPluginInstance = defaultLayoutPlugin();

  return (

    <Worker workerUrl="https://unpkg.com/pdfjs-dist@5.4.296/build/pdf.worker.min.mjs">

      <Viewer fileUrl={fileUrl} plugins={[defaultLayoutPluginInstance]} />

    </Worker>

  );

}

export default PdfView;

 

更近一步