react-native - 如何通过向上滚动使用 react-native-gifted-chat 加载更多消息?
问题描述
当我滚动到顶部时,我想加载更多消息。有一个道具onLoadEarlier
,我在这里传递了一个函数来加载更多消息,但它不起作用。打开聊天框时确实调用了此函数,但我想在滚动到顶部时执行一个函数。
解决方案
当您在 GiftedChat 中点击 Scrollview的顶部时,您可以在listViewProps中使用scrollEventThrottle
和onScroll
props来调用回调。对我来说很好。
<GiftedChat
messages={this.state.messages}
listViewProps={{
scrollEventThrottle: 400,
onScroll: ({ nativeEvent }) => {
if (this.isCloseToTop(nativeEvent)) {
this.setState({refreshing: true});
this.loadMoreChat();
}
}
}}
onSend={messages => this.onSend(messages)}
user={{
_id: 2,
}}
/>
isCloseToTop({ layoutMeasurement, contentOffset, contentSize }) {
const paddingToTop = 80;
return contentSize.height - layoutMeasurement.height - paddingToTop <= contentOffset.y;
}
代码参考取自这里。
推荐阅读
- android - Android 画图 - PorterDuffXfermode SRC_IN 不工作
- python - Yolo 基于区域的输出到 openvino 的解释脚本
- java - 对tomcat的套接字http请求,但响应302
- python - Python Selenium Chrome:打开一个新标签 Ctrl + t(按键盘)
- python - 在 for 循环中启动线程会产生多个结果
- postgresql - SQL 在最大日期左连接
- office365 - office365 图形 api 分配私有组的所有者权限
- java - 一个对象引用一个具有另一个类 B 的对象作为其实例变量的类 A 的对象,是否也指向类型 B 的对象?
- python - 使用 Pandas to_html 时如何设置字符集?
- java - 为什么 count 变量必须在 for 循环的大括号外定义?