查看 webview 中的 base64 pdf 在 Z1BDF605991920DB11CBDF8508204 上反应本机？

Question

这是我正在尝试的

const [pdf, setPdf] = useState("")

let image = "data:application/pdf;base64," + curr.Body.toString('base64');

setPdf(image)

<WebView
            style={styles.pdf}
            useWebKit={true}
            originWhitelist={['*']}
            scrollEnabled={true}
            mediaPlaybackRequiresUserAction={true}
            source={{
                html: `
            <html>
            <object data="${pdf}" type="application/pdf">
                <embed 
                    scrollbar="1" 
                    src="${pdf}" 
                    type="application/pdf" 
                   
                />
            </object>
            </html>
            ` }}
        />

以下是我得到的。 PDF 包含 5 页，但屏幕上只有一个。

帮助我获得完整的 pdf 视图。

Answer 1

尝试使用 ScrollView 包装您的代码以使内容可见/可滚动：

<SafeAreaView style={{flex: 1}}>
      <ScrollView
        style={{ width: '100%' }}
        contentContainerStyle={{ flexGrow: 1 }}
      >
        <WebView
            style={styles.pdf}
            useWebKit={true}
            originWhitelist={['*']}
            scrollEnabled={true}
            mediaPlaybackRequiresUserAction={true}
            source={{
                html: `
            <html>
            <object data="${pdf}" type="application/pdf">
                <embed 
                    scrollbar="1" 
                    src="${pdf}" 
                    type="application/pdf" 
                   
                />
            </object>
            </html>
            ` }}
        />
      </ScrollView>
    </SafeAreaView>

或者你可以使用专门用于阅读pdf的库，例如： https://www.npmjs.com/package/rn-pdf-reader-js下面是一个例子：

<PDFReader
    style={{flex:1, flexGrow:1}}
        source={{
          uri: 'http://www.africau.edu/images/default/sample.pdf',
        }}
      />

查看 webview 中的 base64 pdf 在 Z1BDF605991920DB11CBDF8508204 上反应本机？

问题描述

1 个解决方案

解决方案1
0 2022-01-06 09:26:07

查看 webview 中的 base64 pdf 在 Z1BDF605991920DB11CBDF8508204 上反应本机？

问题描述

1 个解决方案

解决方案1 0 2022-01-06 09:26:07

解决方案1
0 2022-01-06 09:26:07