gpt4 book ai didi

webview - react native : Is it possible to have the height of a html content in a webview?

转载 作者:行者123 更新时间:2023-12-02 06:45:34 29 4
gpt4 key购买 nike

我正在从 api 获取 html 内容,并且希望在我的应用程序中将其呈现为 Web View 。

webview 组件嵌套在 ScrollView 中,因为它在我的渲染函数之上还有一些其他内容,如下所示:

render() {
var html = '<!DOCTYPE html><html><body>' + this.state.pushEvent.Description + '</body></html>';

return (
<ScrollView>
<View style={styles.recipe}>
<Image source={{uri: this.state.pushEvent.ImageUrl}}
style={styles.imgFull} />
<Text style={styles.title}>{this.state.pushEvent.Title}</Text>

<WebView style={{padding: 20}}
automaticallyAdjustContentInsets={false}
scrollEnabled={false}
html={html}>
</WebView>
</View>
</ScrollView>
);
}

问题是我的 html 只有 20pt 高,这是我的填充。有没有聪明的方法来获取内容的高度?

最佳答案

正如我在上面的评论中所写的,这就是我的结论,但我仍然认为应该有更好的解决方案。

这是我从 github 上获得灵感的问题:@hedgerwang answer

在我的 var html 中,我在结束 body 标记之前添加了一个简单的脚本,我只是将 html 的高度保存在文档标题中:

<script>window.location.hash = 1;document.title = document.height;</script>

然后,我在 WebView 组件中添加了 onNavigationStateChange 属性,并通过回调设置了状态“高度”变量,然后将此高度设置为我的 WebView。正如我所说,这确实达到了目的,只是在更改 WebView 中的内容时出现了一点闪烁,但我认为这是一个肮脏的黑客行为。

最后,我决定更改 api,使其具有不必包含在 WebView 中的内容

但这也许会有所帮助,这里是完整的代码。

onNavigationStateChange(navState) {
this.setState({
height: navState.title,
});
}
render() {
var html = '<!DOCTYPE html><html><body>' + this.state.pushEvent.Description + '<script>window.location.hash = 1;document.title = document.height;</script></body></html>';
return (
<ScrollView>
<View style={styles.recipe}>
<Image source={{uri: this.state.pushEvent.ImageUrl}}
style={styles.imgFull} />
<Text style={styles.title}>{this.state.pushEvent.Title}</Text>

<WebView style={{padding: 20}}
automaticallyAdjustContentInsets={false}
scrollEnabled={false}
onNavigationStateChange={this.onNavigationStateChange.bind(this)}
html={html}>
</WebView>
</View>
</ScrollView>
);
}

关于webview - react native : Is it possible to have the height of a html content in a webview?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32952270/

29 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com