React Native动态webview高度 [英] React Native dynamic webview height
问题描述
我有WebView内容，根据内容的数量改变它的高度。
所以我找到了一种如何通过document.title属性onNavigationStateChange来获取内容高度的方法。
看起来像这样：
I have WebView content are which changes it's height depending on amount of content. So I found a way how to take the height of the content through the document.title attribute onNavigationStateChange. Looks like this:
let html = '<!DOCTYPE html><html><body><script>document.title = document.height;</script></body></html>';
on onNavigationStateChange
And on onNavigationStateChange
onNavigationStateChange(navState) {
this.setState({
height: navState.title
});
console.log("DATA");
console.log(this.state.height)
}
关于实际的WebView渲染：
On the actual WebView render I do:
<WebView style={this._setWebviewHeight()}
automaticallyAdjustContentInsets={false}
scrollEnabled={false}
onNavigationStateChange={this.onNavigationStateChange.bind(this)}
html={html}>
</WebView>
其中：
_setWebviewHeight() {
return {
height: this.state.height,
padding: 20,
}
}
在这种情况下，我收到错误，我无法通过州获得内容的高度。那我该怎么办？
And in this case I'm getting error and I am not able to get the height of content through state. What shall I do then?
解决方案的想法来自这里： React native：是否可以在webview中获得html内容的高度？
The idea of solution is taken from here: React native: Is it possible to have the height of a html content in a webview?
推荐答案
我在其中一个RN第三方库中找到了解决方案。
以下是它的链接：
https://github.com/danrigsby/react-native-web-container/blob/master/index.js
I have found the solution in the implementation of one of the RN third party libraries. Here is the link to it: https://github.com/danrigsby/react-native-web-container/blob/master/index.js
有了这种方法一切顺利。
With this kind of approach all worked good.
这篇关于React Native动态webview高度的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
