Question

我有WebView内容，根据内容的数量改变它的高度。所以我找到了一种如何通过document.title属性onNavigationStateChange来获取内容高度的方法。看起来像这样：

let html = '<!DOCTYPE html><html><body><script>document.title = document.height;</script></body></html>';

on onNavigationStateChange

onNavigationStateChange(navState) {
  this.setState({
    height: navState.title
  });
  console.log("DATA");
  console.log(this.state.height)
}

在我实际的WebView渲染上：

<WebView style={this._setWebviewHeight()}
           automaticallyAdjustContentInsets={false}
           scrollEnabled={false}
           onNavigationStateChange={this.onNavigationStateChange.bind(this)}
           html={html}>
</WebView>

其中：

_setWebviewHeight() {
 return {
  height: this.state.height,
  padding: 20,
 }
}

在这种情况下，我收到错误，我无法通过州获得内容的高度。那我该怎么办？

解决方案的想法来自这里：React native: Is it possible to have the height of a html content in a webview?

Answer 1

我在其中一个RN第三方库中找到了解决方案。这是它的链接： https://github.com/danrigsby/react-native-web-container/blob/master/index.js

采用这种方法一切都很好。

Answer 2

只需尝试以下lib：https://github.com/iou90/react-native-autoheight-webview 它将同时在iOS和Android上运行

React Native动态webview高度

2 个答案: