Kann jemand bitte Beispielcode für die Anzeige einer PDF in React Native? iOS und Android.
Das habe ich ausprobiert:
%Vor%^ Dies führt zu einem roten Bildschirm des Todes mit dem Fehler "Das Modul kann nicht aufgelöst werden".
%Vor%^ Dies gibt eine "Error Loading Page" Nachricht in der WebView. "Die angeforderte URL wurde auf diesem Server nicht gefunden"
Ich weiß, dass iOS in der Lage ist, ein PDF in einem UIWebView anzuzeigen. Ich nehme an, Android kann das gleiche tun. Es muss etwas geben, in dem die Quelle angegeben wird, die ich vermisse.
Okay, für zukünftige Generationen, hier ist, wie ich dieses Problem gelöst habe:
Aktualisiert am 13. September 2017:
Es gibt ein neues NPM-Modul, das diesen ganzen Prozess viel einfacher macht. Ich würde vorschlagen, es vorwärts statt meiner ursprünglichen Antwort unten zu verwenden:
Nach der Installation ist das Rendern der PDF-Datei so einfach:
%Vor% Legen Sie einfach Ihre aktuelle PDF-Datei in den Ordner android/app/src/main/assets/pdf
Ihres Projekts.
Ursprüngliche Antwort:
iOS
%Vor% Der Trick ist, dass Sie My.pdf
in Xcode in Ihr Projekt einfügen müssen und sicherstellen, dass es zu Ihrem Build-Ziel hinzugefügt wird.
Das Kopieren in den Projektordner von React Native war nicht ausreichend. Es musste Teil des Xcode-Projekts selbst sein.
Android
Es scheint, dass Android keinen nativen PDF-Viewer bis 5.0 (Lollipop) zur Verfügung gestellt hat. Um das zu umgehen, musste ich drei Schlüsseltechniken anwenden:
files
für meine App. Diese SO-Antwort war sehr hilfreich dabei: Android: Wie kopiert man Dateien aus dem Ordner 'Assets' in SD-Karten?
Ich habe den Code ein wenig optimiert, sodass die Datei nicht in sdcard
, sondern in den files
-Ordner meiner App verschoben wurde. Hier ist, was ich meinem MainActivity.java
Ich habe auch sichergestellt, dass mein PDF im Ordner assets/pdf
unter android/app/src/main
Ich habe dann das Paket react-native-fs verwendet, um die absolute URL für mein PDF zu erhalten Jetzt im Ordner files
:
Mit all dem habe ich reagieren-native-pdf-Ansicht Laden und Anzeigen der PDF:
%Vor%Viel Glück!
Tags und Links pdf webview react-native