使用未在 IOS 上显示的表单字段值在 React Native 中显示 PDF

问题描述

我正在尝试使用 react-native-pdf 在我们的应用程序上创建查看器并尝试 react-native-view-pdf 但我在 IOS 上的 PDF 表单字段中遇到了问题，值/数据未显示。但是当该字段被聚焦/点击时，它将显示值/数据。在 Android 上，表单字段数据按预期显示。 IOS上的图片如下所示：

IOS PDF first load

IOS PDF Field tapped/focused

使用 react-native-pdf：

<View style={{ flex: 1 }}>
    <Pdf
        minScale={1.0}
        maxScale={1.0}
        scale={1.0}
        spacing={0}
        fitPolicy={2}
        enablePaging={true}
     // onTouchStart={(e) => {
     //     console.log('touchMove',e.nativeEvent);
     //     if (this.state.pdfEditMode) {
     //         this.setState({ showDraggrable: false,cxvalue: e.nativeEvent.locationX,cyValue: e.nativeEvent.locationY,xValue: e.nativeEvent.locationX,yValue: e.nativeEvent.locationY },() => {
     //             setTimeout(() => {
     //                 this.setState({ showDraggrable: true,})
     //             },0)
     //         })
     //     }
     // }}
        usePDFKit={false}
        source={{ uri: `data:application/pdf;base64,${this.state.pdfBase64}` }}
        onLoadComplete={(numberOfPages,filePath,{ width,height }) => { this.setPageWH(width,height) }}
        onPageChanged={(page,numberOfPages) => {
            console.log(`current page: ${page}`);
            this.setState({ pageNumber: page });
        }}
        onError={(error) => {
            console.log(error);
        }}
        onPressLink={(uri) => {
            console.log(`Link presse: ${uri}`)
        }}
       // onPageSingleTap={(page,x,y) => {
       //     console.log(x,y)
       //     this.handleSingleTap(page,y);
       // }}
         style={styles.pdf}/> </View>

使用 react-native-view-pdf

<View style={{ flex: 1}}>     
    <PDFView
        fadeInDuration={250.0}
        style={styles.pdf}
        resource={this.state.pdfBase64}
        resourceType={'base64'}
        onLoad={() => console.log(`PDF rendered from base64}`)}
        onError={(error) => console.log('Cannot render PDF',error)}/> 
    </View>

库版本：

 "react": "16.6.3","react-native": "0.58.1","react-native-pdf": "^5.1.7","react-native-view-pdf": "^0.11.0",

解决方法

这将在 IOS 模拟器上而不是在物理设备上。在实体设备上试了一下，填充的值都显示出来了。