@nativescript/pdf

一个简单的 PDF 查看器。它方便地使用了 iOS 的 WKWebView，对于 Android，它使用了 AndroidPdfViewer。

备注 此存储库 是 madmas/nativescript-pdf-view 的替代品，它是 由 Merott 开发的原始版本 的分支，并将在他的同意下使用，以提供进一步的维护。

内容

• 安装
• 用法
  • 核心
  • Angular
  • Vue
  • Svelte
  • React
• PDFView API
  • loadEvent
  • src
  • notifyOfEvent()
  • loadPDF()

安装

npm install @nativescript/pdf

用法

核心

<Page
  xmlns="http://schemas.nativescript.org/tns.xsd"
  xmlns:pdf="@nativescript/pdf"
  loaded="pageLoaded">
  <pdf:PDFView src="{{ pdfUrl }}" load="{{ onLoad }}" />
</Page>

查看完整示例 NativeScript TypeScript: pdf

Angular

import { NativeScriptPdfModule } from '@nativescript/pdf/angular'

@NgModule({
	imports: [
    NativeScriptCommonModule, 
    ...
    NativeScriptPdfModule
  ],

<PDFView [src]="pdfUrl" (load)="onLoad()"></PDFView>

查看完整示例 NativeScript Angular: pdf

Vue

1. 在 app.ts 文件中注册组件。

registerElement('PDFView', () => require('@nativescript/pdf').PDFView);

2. 然后，在标记中使用它。

 <PDFView :src="pdfUrl" row="1"></PDFView>

Svelte

1. 在 app.ts 文件中注册组件。

registerElement('pDFView', () => require('@nativescript/pdf').PDFView);

2. 然后，在标记中使用它。

 <pDFView src={ pdfUrl } row="1"></pDFView>

查看完整示例 NativeScript Svelte: pdf

React

1. 在 app.ts 文件中注册组件

interface PDFViewAttributes extends ViewAttributes {
src:string;
}
declare global {
    module JSX {
        interface IntrinsicElements {
          
          pdfView: NativeScriptProps<PDFViewAttributes, PDFViewCommon>
            
        }
    }
}
registerElement("pdfView", ()=> require("@nativescript/pdf").PDFView)

2. 如下所示在标记中使用它

<gridLayout class="px-5" columns="*" rows="auto, *">

  <button
      height="70"
      text="Show Another!"
      class="text-[#76ABEB] font-bold mt-8 mb-5 text-lg"
      onTap={this.changePDF}
  >
  </button>

  <pdfView src={this.state.pdfUrl} row="1" onLoaded={this.onLoaded}></pdfView>
</gridLayout>

您可以在 StackBlitz 上找到完整示例 这里。

PDFView API

loadEvent

PDFView.loadEvent

src

pdfView.src = 'some-pdf-url'

设置 PDF 文件的 src

notifyOfEvent()

PDFView.notifyOfEvent(eventName: string, pdfViewRef: WeakRef<Common>)

loadPDF()

pdfView.loadPDF(src)

在指定的源加载 PDF 文件。