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

Vis PDF-filer i din React-app uden problemer gennem React-PDF

React-PDF giver dig mulighed for at vise PDF-filer, som om de var billeder i en React-app uden besvær eller ved at bruge flere plugins.

Der er mange gange, udviklere skal tilføje PDF'er til React-applikationer, og selvom det kan være svært at få opløsningen, størrelsen eller layoutet rigtigt, lader React-PDF dig tilføje PDF'er til en React-applikation ligesom billeder. Det er gratis at downloade, open source og en komplet pakke. React PDF blev udviklet ved hjælp af JavaScript og CSS og er fuldstændig kompatibel med enhver React-applikation.

Der er mange versioner af React-PDF tilgængelige i øjeblikket, hvor den seneste er React-PDF v5. De andre versioner får løbende fejlrettelser og opdateringer, men brug af React-PDF v5 vil give optimale resultater.

For at bruge React-PDF skal du sørge for, at din React-applikation bruger den seneste version af React, dvs. React 16.3 eller nyere. Hvis du bruger ældre versioner af React, skal du bruge de ældre versioner af React-PDF.

Previous Next

Kom godt i gang med React-PDF

Den anbefalede og nemmeste måde at komme i gang på er at installere via npm, nedenfor er kommandoen.

Installer React-PDF via npm

npm install react-pdf

Du kan også installere det manuelt; download de seneste udgivelsesfiler direkte fra GitHub-lageret.

Gengivelse af ikke-latinske tegn i gratis JavaSrcipt API

Open source React-PDF-biblioteket gør det muligt for softwareudviklere at gengive ikke-latinske tegn i deres egen applikation ved hjælp af JavaScript-kommandoer. React-PDF har også understøttelse af ikke-latinske tegn, og hvis du vil sikre dig, at eventuelle ikke-latinske tegn gengives korrekt, når en PDF vises i et projekt, kan du få det gjort med cMaps kopieret fra pdfjs-dist.

Indlæs enkelte eller flere PDF-sider ved hjælp af gratis JavaScript API

Dokumentmærket giver dig mulighed for at indlæse et PDF-dokument, der sendes gennem fil-prop. Med dette tag kan du enten indlæse en enkelt eller flere sider eller også tilføje navigation. Du kan også fremhæve tekst på en side, vise indholdsfortegnelse på en interaktiv måde og også give eksterne links.

Sådan viser du en enkelt PDF-side via JavaScript API

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

Administrer annoteringer i PDF-dokumenter via JavaScript

Open source JavaScript-biblioteket React-PDF giver softwareprogrammører mulighed for programmæssigt at administrere forskellige typer annoteringer i deres PDF-dokumenter. Husk, at brugerens behov skal inkludere et stilark, der er nødvendigt for, at annoteringer kan vises korrekt. Det giver brugerne mulighed for nemt at fremhæve, tekst, blæk, noter, former og mere.

Sådan håndteres eksterne links i PDF'er via JavaScript

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 (
    
      
    
  );
}
 Dansk