有声小说下载,盗墓笔记

新聞中心

這里有您想知道的互聯(lián)網(wǎng)營(yíng)銷解決方案

如何在vue中使用pdfjs顯示PDF可復(fù)制

今天小編給大家分享一下如何在vue中使用pdfjs顯示PDF可復(fù)制的相關(guān)知識(shí)點(diǎn)，內(nèi)容詳細(xì)，邏輯清晰，相信大部分人都還太了解這方面的知識(shí)，所以分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后有所收獲，下面我們一起來(lái)了解一下吧。

目前成都創(chuàng)新互聯(lián)公司已為上1000家的企業(yè)提供了網(wǎng)站建設(shè)、域名、網(wǎng)絡(luò)空間、綿陽(yáng)服務(wù)器托管、企業(yè)網(wǎng)站設(shè)計(jì)、鹽山網(wǎng)站維護(hù)等服務(wù)，公司將堅(jiān)持客戶導(dǎo)向、應(yīng)用為本的策略，正道將秉承"和諧、參與、激情"的文化，與客戶和合作伙伴齊心協(xié)力一起成長(zhǎng)，共同發(fā)展。

pdf顯示的方法

方法一

使用embed標(biāo)記來(lái)使用瀏覽器自帶的pdf工具。

這種實(shí)現(xiàn)方式優(yōu)缺點(diǎn)都很明顯：

優(yōu)點(diǎn)：自帶“打印”，“搜索”，“翻頁(yè)”等功能，強(qiáng)大且實(shí)現(xiàn)方便。

缺點(diǎn)：不同瀏覽器的pdf工具樣式不一，且無(wú)法滿足個(gè)性化需求，比如：禁止打印，下載等。

方法二

使用Mozilla的PDF.js，自定義展示PDF。

基礎(chǔ)功能集成
使用Text-Layers渲染(可實(shí)現(xiàn)pdf內(nèi)容復(fù)制)

什么是PDF.JS

PDF.js是基于HTML5技術(shù)構(gòu)建的，用于展示可移植文檔格式的文件(PDF)，它可以在現(xiàn)代瀏覽器中使用且無(wú)需安裝任何第三方插件。

安裝：

npm install pdfjs-dist

基礎(chǔ)功能有兩個(gè)必須引用的文件：

pdf.js
pdf.worker.js

如果使用npm的方式，則在需要使用PDF.js的文件中如下引用:

import PDFJS from 'pdfjs-dist';

PDFJS.GlobalWorkerOptions.workerSrc = 'pdfjs-dist/build/pdf.worker.js';

這兩個(gè)文件包含了獲取、解析和展示PDF文檔的方法，但是解析和渲染PDF需要較長(zhǎng)的時(shí)間，可能會(huì)阻塞其它JS代碼的運(yùn)行。

為解決該問(wèn)題，pdf.js依賴了HTML5引入的Web Workers——通過(guò)從主線程中移除大量CPU操作（如解析和渲染）來(lái)提升性能。

PDF.js的API都會(huì)返回一個(gè)Promise，使得我們可以優(yōu)雅的處理異步操作。

使用

本文章只介紹在vue中的使用, 下面是自己寫的展示pdf的組件可以直接拿去用

注：具體解釋請(qǐng)看下面代碼中的注釋






 .drag-box {
  height: 800px;
 }
 .pdf-box {
  position: relative;
 }
 .el-scrollbar__wrap {
  overflow-x: hidden;
 }

以上就是“如何在vue中使用pdfjs顯示PDF可復(fù)制”這篇文章的所有內(nèi)容，感謝各位的閱讀！相信大家閱讀完這篇文章都有很大的收獲，小編每天都會(huì)為大家更新不同的知識(shí)，如果還想學(xué)習(xí)更多的知識(shí)，請(qǐng)關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道。

分享文章：如何在vue中使用pdfjs顯示PDF可復(fù)制
文章分享：http://fisionsoft.com.cn/article/jhchsj.html

新聞中心

其他資訊