リアクトネイティブ：アプリケーションでローカルPDFファイルを開きます

bugfix> android > 投稿 2020-08-22 17:04

ボタンがクリックされたらユーザーに表示したいpdfがあります。私はユーザーに次のようなPDFを表示することに成功しています。

<TouchableOpacity onPress={() => Linking.openURL('www.somesite.com/manual.pdf')}>
  <Text>See pdf</Text>
</TouchableOpacity>

これは、ネイティブpdfリーダーを開き、それに応じてコンテンツをダウンロードしたため、素晴らしかったです。ローカルアプリケーションのpdfファイルで同様の結果を達成したいのですが、openUrl APIを使用して同様の効果を達成する方法がわかりません。

私はで答えを見ましたAndroidのWebViewでローカルPDFファイルを開く方法しかし、このソリューションは、アプリ内コンポーネントとしてスタイル設定およびレイアウトする必要があるwebViewコンポーネントを作成するようです。それは私が欲しいものではありません。ネイティブのpdfビューアでローカルファイルの内容を読み取って、それを実行したいだけです。

android

react-native

回答 1 件

「react-native-view-pdfパッケージを試すことができます。これは非常に単純で、NPMの依存関係はありません。
```
import PDFView from 'react-native-view-pdf';
<View style={{ flex: 1 }}>
  <PDFView
    style={{ flex: 1 }}
    onError={(error) => console.log('onError', error)}
    onLoad={() => console.log('PDF rendered from url')}
    resource="http://www.pdf995.com/samples/pdf.pdf"
    resourceType="url"
  />
</View>
```
また、このソリューションを使用すると、外部アプリでPDFドキュメントを開く代わりに、PDFドキュメントをアプリケーションに簡単に埋め込むことができます。たとえば、別のページにすることができます。既に本番環境で問題なく使用しており、ローカルファイル、URL、またはbase64文字列からPDFを開くことができます。

それ以外の場合、外部アプリでPDFを開くには、ファイルに書き込み、リンクを使用する必要があります。

bugfix

リアクトネイティブ：アプリケーションでローカルPDFファイルを開きます

android

react-native

関連記事