1

我正在使用 Webview 将一些内容呈现到视图中，以计算内容的高度我使用脚本来获取内容的高度，span 标签包含内容。

<html id="htmlContent">
<body>
    <span>
    ...
    //content
    ...
    </span>
    <script>
        document.addEventListener('DOMContentLoaded', function () {
            document.title = document.getElementById('htmlContent').offsetHeight;
            window.location.hash = 1;
        });
    </script>
</body>
</html>

这是 webview 组件：

const commonHtmlStyle= `font-weight:300; font-family:sans-serif; font-size: 18px; color:rgb(136,136,136); backgroundColor:rgba(0,0,0,0);`;

<WebView style={{ height:  this.state.height }}
    ref={(ref) => { this.webview = ref; }}
    automaticallyAdjustContentInsets={true}
    scrollEnabled={false}
    javaScriptEnabled={true}
    source={{ html: voca.sprintf(commonHtml, commonHtmlStyle, this.state.content) }}
    onNavigationStateChange={this.setState({
        height: parseInt(navState.title) 
    })}
/>

所以结果，我在 Android 中运行时看到空格（脚本返回高度的两倍）和 iOS 上的剪辑内容（返回的高度小于内容高度）。

我尝试使用其他 autoHeight webview 组件，例如（react-native-webview-autoheight），但对于 iOS 和 Android 仍然显示几乎相同的结果。

我正在尝试解决这个问题，但无法解决这个问题。任何帮助，将不胜感激。

4

0 回答 0