- 综合排序
- 最热优先
- 最新优先
- 来自专栏web开发
react-pdf预览在线PDF的使用
1、在react项目中安装react-pdf依赖包 建议安装8.0.2版本的react-pdf，如果安装更高版本的可能出现一些浏览器的兼容性问题； npm install react-pdf@8.0.2 useState } from 'react' import { Modal, Spin, Alert } from 'antd' import { Document, Page, pdfjs } from 'react-pdf ' import 'react-pdf/dist/esm/Page/AnnotationLayer.css' import 'react-pdf/dist/esm/Page/TextLayer.css' AddCircleOutline, MinusCircleOutline } from 'antd-mobile-icons' import { Document, Page, pdfjs } from 'react-pdf '; import 'react-pdf/dist/esm/Page/AnnotationLayer.css'; // 样式导入 import 'react-pdf/dist/esm/Page/TextLayer.css
1.6K10编辑于 2024-09-15 - 来自专栏前端专享
使用 react-pdf 打造在线简历生成器
React-PDF 简介 React PDF 是一个使用 React 创建 PDF 文件的工具，支持在浏览器、移动设备和服务器上创建PDF文件。 可以用它们轻松地将内容呈现到文档中，我们可以使用 CSS 属性进行样式设置，使用 flexbox 进行布局，它支持渲染文本、canvas、 svg 等等，详情可以参考官网 程序实现 今天我将使用 React-pdf /renderer React-pdf 渲染需要一些额外的依赖项和 webpack5 配置。 yarn add process browserify-zlib stream-browserify util buffer assert 这一步骤是因为 React-pdf 构建在 PDFKit 的基础之上 import React from 'react' import { Document, Page, PDFViewer, PDFDownloadLink } from '@react-pdf/renderer
3.6K30编辑于 2022-02-24 使用 React PDF 构建 React.js PDF 查看器的指南
开源 React.js PDF 查看器库在 React.js 开发中，各种开源库，尤其是非常流行的react-pdf和 @react-pdf/renderer，为 PDF 查看提供了便利。 @react-pdf/renderer 在 npm 上的每周下载量高达 5.4 万次，而 React-PDF 在 npm 上的每周下载量也高达 100 万次。 在这篇博文中，我们将重点介绍如何使用 React-PDF 构建一个免费的 PDF 查看器。 import { useState } from "react"import { Document, Page, pdfjs } from "react-pdf"import "react-pdf/dist 的局限性尽管 React-PDF 是一个出色的开源项目，但它也有其局限性：缺乏内置用户界面： React-PDF 没有预置的用户界面。
1.1K10编辑于 2025-05-20- 来自专栏前端实验室
牛逼! 像展示图片一样便捷的预览 PDF 文件
这款React-PDF组件你值得拥有! React-PDF React-pdf提供了一个 React 组件API，允许打开PDF文件并使用PDF.js渲染,在 React 应用程序中显示 PDF，像展示图片一样便捷的预览 PDF 文件. 虽然 React-pdf 只是一个PDF查看的库,但却也有着其他强大的功能: 易于使用 - 插入Document组件并给它一个文件道具。 安装 新建 react项目,初始化后添加react-pdf依赖 npm install react-pdf or yarn add react-pdf or pnpm install react-pdf Star：6.6K Github：https://github.com/wojtekmaj/react-pdf 官网：https://projects.wojtekmaj.pl/react-pdf/
2.2K20编辑于 2023-05-23 - 来自专栏新零售项目实践
React 项目实战 | 探索 React 项目中第三方 PDF 查看器虚拟滚动功能：从调研到实践
一、PDF查看器技术方案选型1.1 主流PDF查看库对比在React生态中，有多个可用于渲染PDF的第三方库，每个库都有其特点和适用场景：库名称懒加载缩略图移动端适配社区活跃度 ★react-pdf✅❌ 二、react-pdf基础实现方案2.1 核心组件与APIreact-pdf提供了三个核心组件：Document：PDF文档容器组件。Page：单个PDF页面渲染组件。 import { Document, Page, pdfjs } from 'react-pdf';// 配置PDF.js worker路径（必须）pdfjs.GlobalWorkerOptions.workerSrc 三、虚拟滚动与懒加载优化方案3.1 虚拟滚动原理虚拟滚动（Virtual Scrolling）通过仅渲染可视区域内的内容，大幅减少DOM节点数量：3.2 基于react-pdf的懒加载实现结合react-pdf important; }}结语通过本文的学习，我们了解了 React 生态中多种 PDF 查看器插件的选择，掌握了 react-pdf 插件的使用方法，学会了如何结合虚拟滚动技术实现大文件的懒加载。
49010编辑于 2025-07-03 - 来自专栏信安百科
CVE-2024-4367｜Mozilla PDF.js代码执行漏洞
0x02 CVE编号 CVE-2024-4367 0x03 影响版本 Mozilla PDF.js < 4.2.67 pdfjs-dist(npm) < 4.2.67 react-pdf(npm) < 7.7.3 8.0.0 <= react-pdf(npm) < 8.0.2 0x04 漏洞详情 https://github.com/mozilla/pdf.js/security/advisories
3.6K20编辑于 2024-05-22 - 来自专栏开源服务指南
云服务仿真：完全模拟 AWS 服务的本地体验 | 开源日报 No.45
wojtekmaj/react-pdf[6] Stars: 7.7k License: MIT 这个项目是一个名为 “react-pdf monorepo” 的开源项目。 github.com/amplication/amplication [5] abpframework/abp: https://github.com/abpframework/abp [6] wojtekmaj/react-pdf : https://github.com/wojtekmaj/react-pdf
77640编辑于 2023-10-08 - 来自专栏zayyo前端
React大法：如何轻松编写动态PDF文件
reports 为了启用 PDF 下载，我们将使用react-pdf提供有用组件的包，如Document、Page、View、Image、Text、PDFDownloadLink等PDFViewer。 create-react-app react-pdf-invoice 成功创建应用程序后，使用以下命令转到目录并启动项目 - cd react-pdf-invoice npm start 在react应用程序中安装react-pdf 的命令： 使用 npm npm install @react-pdf/renderer --save 使用纱线 yarn add @react-pdf/renderer 文件夹结构： 创建发票表格 由于我们的 /getPDF/InvoicePDF'; import { PDFDownloadLink } from '@react-pdf/renderer'; import '. InvoicePDF.js import React from 'react'; import { Page, Text, View, Document, StyleSheet } from '@react-pdf
1.5K60编辑于 2023-10-04 - 来自专栏前端实验室
推荐10个React Native 开源项目，yyds~
5.react-chrono 用于 React 的现代时间轴组件 Github： https://github.com/prabhuignoto/react-chrono 6.React-PDF react-pdf Github： https://github.com/wojtekmaj/react-pdf 7.rodal 一款带动画的 React 模态框组件。比如旋转进入视图、滑动、淡入、缩放、翻转等。
2.7K20编辑于 2023-08-10 - 来自专栏PDF 开发
2024 年 最佳 JavaScript PDF 阅读器
优点• 易于使用：React-pdf提供了一系列即插即用的React组件，如Document或Page，相对容易安装和使用，用于将PDF显示为图像。 • 隐私保障：React-pdf通过不收集或传输任何关于用户或文档的信息，优先保护用户隐私。 考虑因素• 需要自行构建UI：React-pdf缺乏开箱即用的UI，需要用户构建自己的阅读器界面，这可能并非适合所有人。 • 依赖于PDF.js：它在内部使用PDF.js，PDF.js中发现的任何漏洞也会影响到react-pdf。
1.7K10编辑于 2024-04-02 - 来自专栏JowayYoung谈前端
npm依赖(框架平台)
react-hold: React占位组件 react-hot-loader: React模块热替换转换器 react-lazyload: React懒加载组件 react-loadable: React动态加载组件 react-pdf
3.5K20发布于 2020-04-01 - 来自专栏前端技术江湖
你不知道的33个令人惊艳的React开发库
react-router-dom image.png react-pdf image.png react-h5-audio-player image.png React HTML5 音频播放器组件
2.7K20编辑于 2023-08-21 - 来自专栏前端专享
微信排版工具新选择
(https://juejin.cn/post/7052646487632642084) - [《使用 react-pdf 打造在线简历生成器》](https://juejin.cn/post/7067108714355884069
1.8K10编辑于 2022-05-17 - 来自专栏code秘密花园
周百万下载量的 NPM 包可执行任意 JS 代码，数十万网站可能受影响！
大多数包装库，如 react-pdf，也已发布了补丁版本。
1.4K10编辑于 2024-07-01 - 来自专栏黯羽轻扬
完全理解React Fiber
包括React DOM、React Native、React ART、ReactHardware、ReactAframe、React-pdf、ReactThreeRenderer、ReactBlessed
1.8K60发布于 2019-06-12
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号