ReactNative 0.28:根据内容高度调整WebView的大小
我问的问题基本上和,但是对于RN 0.28+。各种答案中提供的解决方案在RN 0.28中似乎不起作用,因此我希望有其他配置或黑客 有没有办法根据内容的高度调整WebView的大小?我曾尝试将文档高度插入标题中,并使用ReactNative 0.28:根据内容高度调整WebView的大小,webview,react-native,Webview,React Native,我问的问题基本上和,但是对于RN 0.28+。各种答案中提供的解决方案在RN 0.28中似乎不起作用,因此我希望有其他配置或黑客 有没有办法根据内容的高度调整WebView的大小?我曾尝试将文档高度插入标题中,并使用onNavigationStateChange将其读回,但它总是返回568(类似于) 但它们都是未定义的。我得到的最接近的是这样的东西(来自): 但对于返回20的短文本内容,以及对于更长的文本内容(一个完整的句子),它返回40…这两者似乎都不准确 我也开始尝试,但repo表明它没有得
onNavigationStateChange
将其读回,但它总是返回568
(类似于)
但它们都是未定义的。我得到的最接近的是这样的东西(来自):
但对于返回20的短文本内容,以及对于更长的文本内容(一个完整的句子),它返回40…这两者似乎都不准确
我也开始尝试,但repo表明它没有得到积极维护,npm
上的最新版本不支持RN 0.28,因为它们对导入React本身(而不是从ReactNative)进行了更改
有没有人让WebView使用RN 0.28正确调整大小?经过大量研究和修补,我发现这种方法是将文档标题设置为屏幕高度值的更复杂版本。在我的测试中,这在使用react native 0.47的Android和iOS上都有效
经过大量研究和修补,我发现这种方法是将文档标题设置为屏幕高度值的一种稍微复杂的方法。在我的测试中,这在使用react native 0.47的Android和iOS上都有效
这个问题有什么进展吗?对不起,没有。我们对它进行了黑客攻击,然后离开了RN,专注于基于web的实现,因此没有找到一个干净的解决方案。这个问题有什么进展吗?对不起,没有。我们对它进行了黑客攻击,然后离开了RN,专注于基于web的实现,因此没有找到一个干净的解决方案。
return <TouchableHighlight onPress={() => console.log('touched ' + this.props.choice.id)}
style={styles.choiceRowWrapper} >
<View style={styles.choiceWebViewWrapper}>
<WebView automaticallyAdjustContentInsets={false}
javascriptEnabled={true}
onNavigationStateChange={(navState) => this._updateWebViewNavState(navState)}
scrollEnabled={false}
source={{html: WrapHTML(this.props.choice.text)}}
style={[styles.choiceWebView, {height: this.state.height}]} />
</View>
</TouchableHighlight>
}
_updateWebViewNavState = (navState) => {
console.log(navState);
if (navState.title) {
this.setState({ height: parseInt(navState.title) });
}
}
function WrapHTML (markup) {
return `<!DOCTYPE html>
<html>
<head>
</head>
<body class="content">
${markup}
</body>
<script>window.location.hash = 1;document.title = document.height;</script>
</html>`;
};
document.scrollHeight.contentSize.height
document.body.height
document.getElementById("content").offsetHeight;