Skip to content

打开文档

ComPDFKit PDF SDK for React Native 允许您使用原生模块打开文档。以下是一些使用示例,以帮助您快速入门。

打开一个 PDF

以下是使用原生模块 API 打开 PDF 文档的方法:

tsx
import { Component } from "react";
import { ComPDFKit } from "@compdfkit_pdf_sdk/react_native";
import { Platform } from "react-native";

const _document: string = Platform.OS == 'android' ? 'file:///android_asset/PDF_Document.pdf' : 'PDF_Document.pdf';

type Props = {};
export default class ExampleApp extends Component<Props> {

  componentDidMount(): void {
    // 在使用其他 ComPDFKit API 之前,请通过调用 init_ 或 initialize 方法初始化 ComPDFKit SDK。
		// ComPDFKit.init_('your compdfkit license')
		// 打开示例文档
    ComPDFKit.openDocument(_document, '', ComPDFKit.getDefaultConfig({}));
  }

  render() {
    return null;
  }
}
AppRegistry.registerComponent('App', () => ExampleApp);

以下是使用UI组件API打开PDF文档的方法:

tsx
import React, { Component } from 'react';
import { SafeAreaView } from 'react-native';
import { ComPDFKit, CPDFReaderView } from '@compdfkit_pdf_sdk/react_native';
import { Platform } from 'react-native';

type Props = {};

export default class App extends Component<Props> {

  constructor(props: Props) {
    super(props)
    this.initialize()
  }

  async initialize() {
    // 离线认证,请填写你的离线许可证。
    var result = await ComPDFKit.init_('your compdfkit license')
    console.log("ComPDFKitRN", "init_:", result)
  }

  samplePDF = Platform.OS === 'android'
  ? 'file:///android_asset/PDF_Document.pdf'
  : 'PDF_Document.pdf';

  render() {
    return (
        <CPDFReaderView
          document={this.samplePDF}
          configuration={ComPDFKit.getDefaultConfig({})}
          style={{ flex: 1 }}
        />
    );
  }
}