1. produkty
  2.   PDF
  3.   JavaScript
  4.   React-PDF
 
  

Zobrazte soubory PDF ve své aplikaci React bez problémů prostřednictvím React-PDF

React-PDF umožňuje zobrazovat soubory PDF, jako by to byly obrázky v aplikaci React, a to bez jakýchkoli potíží nebo použití více pluginů.

Vývojáři často potřebují přidávat soubory PDF do aplikací React, a přestože může být obtížné dosáhnout správného rozlišení, velikosti nebo rozložení, React-PDF vám umožňuje přidávat soubory PDF do aplikace React stejně jako obrázky. Je zdarma ke stažení, open source a kompletní balíček. React PDF byl vyvinut pomocí JavaScriptu a CSS a je plně kompatibilní s jakoukoli aplikací React.

V současné době je k dispozici mnoho verzí React-PDF, přičemž nejnovější je React-PDF v5. Ostatní verze také průběžně dostávají opravy chyb a aktualizace, nicméně použití React-PDF v5 poskytne optimální výsledky.

Abyste mohli používat React-PDF, ujistěte se, že vaše aplikace React používá nejnovější verzi React, tj. React 16.3 nebo novější. V případě, že používáte starší verze Reactu, budete muset použít starší verze React-PDF.

Previous Next

Začínáme s React-PDF

Doporučený a nejjednodušší způsob, jak začít, je instalace přes npm, níže je příkaz.

Nainstalujte React-PDF přes npm

npm install react-pdf 

Můžete jej také nainstalovat ručně; stáhněte si nejnovější soubory vydání přímo z úložiště GitHub.

Nelatinkové vykreslování znaků ve bezplatném JavaSrcipt API

Knihovna React-PDF s otevřeným zdrojovým kódem umožňuje vývojářům softwaru programově vykreslovat znaky jiné než latinky uvnitř jejich vlastní aplikace pomocí příkazů JavaScriptu. React-PDF má také podporu nelatinkových znaků, a pokud se chcete ujistit, že všechny nelatinkové znaky jsou správně vykresleny při zobrazení PDF v projektu, můžete to udělat pomocí cMaps zkopírovaných z pdfjs-dist.

Načtěte jednu nebo více stránek PDF pomocí bezplatného JavaScript API

Tag Dokument vám umožňuje načíst dokument PDF, který je předán přes podpěru Soubor. Pomocí této značky můžete načíst jednu nebo více stránek nebo přidat navigaci. Můžete také zvýraznit text na stránce, zobrazit obsah interaktivním způsobem a také poskytnout externí odkazy.

Jak zobrazit jednu stránku PDF přes JavaScript API

import React from 'react';
import { Document, Page } from 'react-pdf';
import samplePDF from './test.pdf';
export default function Test() {
  return (
    
      
    
  );
}

Správa anotací v dokumentech PDF pomocí JavaScriptu

Open source JavaScriptová knihovna React-PDF dává softwarovým programátorům možnost programově spravovat různé typy anotací uvnitř jejich PDF dokumentů. Pamatujte, že uživatel potřebuje zahrnout šablonu stylů potřebnou pro správné zobrazení poznámek. Umožňuje uživatelům snadno zvýrazňovat, text, inkoust, poznámky, tvary a další.

Jak zacházet s externími odkazy v PDF pomocí JavaScriptu

import React, { useState } from 'react';
import { Document, Outline, Page } from 'react-pdf';
import samplePDF from './test.pdf';
export default function Test() {
  const [pageNumber, setPageNumber] = useState(1);
  function onItemClick({ pageNumber: itemPageNumber }) {
    setPageNumber(itemPageNumber);
  }
  return (
    
      
    
  );
}
 Čeština