ScrollView中的FlatList不能正常工作，它加载所有分页的数据，即使没有滚动，onEndReached错误
是由于FlatList组件没有正确设置分页加载数据的逻辑所导致的。
要解决这个问题，首先需要确保FlatList的配置正确。在FlatList组件中，需要设置以下几个关键属性：
- data：用于指定要渲染的数据源。
- renderItem：用于定义每个列表项的渲染方式。
- keyExtractor：用于为列表项生成唯一的key。
- onEndReachedThreshold：用于设置滚动到底部时触发onEndReached事件的阈值。
当FlatList组件没有正确配置时，可能会导致加载所有数据或出现onEndReached错误。
以下是解决该问题的步骤：
- 首先，确保数据源（data）传递给FlatList的是分页加载的数据，而不是所有数据。你可以通过调用API获取每页的数据，然后将每页的数据传递给data属性。
- 其次，确保正确设置了renderItem属性，以正确渲染每个列表项。renderItem属性应该是一个函数，根据传递给它的每个数据项来渲染列表项的内容。
- 确保设置了keyExtractor属性，以为每个列表项生成唯一的key。这可以是数据项的唯一ID或其他唯一标识符。
- 最后，确保设置了onEndReachedThreshold属性，该属性决定了滚动到底部时触发onEndReached事件的位置。你可以尝试设置不同的值来适应你的需求。
在腾讯云的产品中，可以使用 Taro 框架进行跨平台开发，使用云开发能力实现数据存储与管理，通过云函数实现后端逻辑，使用云数据库实现数据的分页加载和实时同步等功能。
参考文档：
- Taro框架介绍：https://taro-docs.jd.com/taro/docs/README/
- 云开发能力：https://cloud.tencent.com/product/tcb
- 云函数：https://cloud.tencent.com/product/scf
- 云数据库：https://cloud.tencent.com/product/tcdb
相关·内容
我在ScrollView中有FlatList，FlatList有onEndReached方法来加载分页数据(onEndReachedThreshold设置为0.1).The问题，onEndReached方法甚至没有滚动就一直触发。<FlatList removeClippedSubviews
initialNumToRender
浏览 36提问于2019-06-18得票数 1
下面是我的简单category list page的render()函数。最近，我为我的FlatList视图添加了分页，所以当用户滚动到底部时，会在某个点(从底部的onEndReachedThreshold值长度)调用onEndReached，它将获取下一个categories但我的问题是，当()被称为时，就调用了FlatList，换句话说，FlatList的onEndRe
浏览 24提问于2017-12-20得票数 54
回答已采纳
>0 && data={tree.myPoiComments.CommentInfo} onEndReachedThreshold={1}我已经看过了react native的github中的
浏览 5提问于2018-02-23得票数 5
我在使用react native中的列表视图onEndReached组件时遇到了一些问题。_renderRow } onEndReachedThreshold = {10}/>在我打开屏幕的那一刻，_fetchMoreHistory被调用了两次，并在到达onEndReached之后正常工作
浏览 0提问于2016-12-23得票数 6
1回答
我遇到了SectionList组件的问题，有时它不会呈现所有部分，而是只呈现第一部分。我做了一些调试，可能已经找到了一个修复程序，但我不知道它为什么会修复这个问题。我的页面将始终呈现第一部分，但有时不呈现第二部分。通过一些测试，我发现如果我将所有项目放在一个部分下，它将始终呈现没有问题。这个问题似乎只有在有另一个包含大量项目的部分时才会发生。section.name, };
return sectio
浏览 26提问于2019-01-18得票数 1
回答已采纳
我正在构建一个使用FlatList在Reactinative中的提要。通过对服务器进行异步调用，我对每页进行分页和获取10行。我使用onEndReached和onEndReachedThreshold调用一个函数，该函数获取下一页的数据。提要的页码和数据存储在组件状态中。
当我从服务器接收数据时，我连接到状态中的数据。避免紧张行为的</e
浏览 1提问于2018-07-05得票数 1
问题是任何带有ListView的onEndReached={() => alert('load more 1')}都不会运行警报，所以当我向下滚动并到达列表视图的末尾时，我再也不能加载更多的信息了。删除包装ScrollView并运行警报，但是普通的Header不会滚动，因为我们刚刚删除了包装ScrollView。标题需要与列表视图一起滚动，这就是为什么我包
浏览 2提问于2016-08-11得票数 15
回答已采纳
我的屏幕布局是SectionList，在View中，在onEndReached上，我调用API来成功地获取分页数据(LoadMore行为)。由于SectionList只覆盖了屏幕的40%，所以我尝试添加ScrollView，这样整个屏幕就可以滚动。
问题:当屏幕加载时，获取初始分页数据。在呈现UI之后，会触发onEndReached事件，然后调用api再次加载更多
浏览 3提问于2021-05-25得票数 4
回答已采纳
我想知道有没有人用firestore提供的数据实现了虚拟滚动FlatList？我目前使用的onEndReached有一个处理程序，它会重新触发一个firestore查询，其中的“limit”选项每次都会递增10。工作正常，但有一个问题，如果我继续滚动，即使在结束时，“限制”值只会继续增加。实现我所追求的目标的最好方法是什么？(我不是在寻找“加载更
浏览 0提问于2019-02-17得票数 0
我正在尝试实现Somedata的Flatlist，它在一个数组中包含了近200个元素，并且传入了数据。我试图给用户的选择，以加载休息时，他们滚动只。但是onEndReached发生的情况是，即使我们没有滚动(我通过做控制台日志检查)，它仍然在呼叫。如何确保onEndReached仅在用户滚动时调用。我尝试将onEndReache
浏览 5提问于2019-01-31得票数 0
2回答
我已经为使用Flexbox进行了一段时间的屏幕布局，直到今天我不得不做这个非常简单的布局时，我才遇到任何麻烦：
我希望内容部分比页眉和页脚大3倍，所以我自然地将flex设置为1(页眉)、3(内容)、1(页脚)。控制布局的唯一方法是保留内容的flex: 1，并将页脚和页眉设置为flex: 0.33。我怀疑这可能与我设置为flex
浏览 1提问于2018-07-31得票数 3
回答已采纳
<View style={{ flex: 1 }}> refreshing={this.state.refreshingkeyExtractor={extractKey} onRefresh={this.handleRefresh} onEndReachedThre
浏览 0提问于2018-10-27得票数 1
2回答
我正在使用PureComponent渲染我的FlatList的项目，当我使用FlatList并在数据中传递一个本地状态给它时，渲染工作得很好，我没有浪费的重新渲染。但是，当我将FlatList与我redux存储在数据中的数组一起使用时，如果我向下滚动，那么每次调用onReachEnd时，重新呈现的效果都会很好。但是当我没
浏览 5提问于2019-08-13得票数 3
我正在使用Flatlist和React Native for Android，我需要在Flatlist的"Up“和"Down”位置(或水平视图中的"Left“和"Right”)到达Flatlist的末尾时动态加载新数据然而，Flatlist只有本机函数可以在onEndReached中“向下”(或在水平方向上“向右”)执行某些操作。你可以通过检测用户是否向左或向
浏览 12提问于2019-03-19得票数 2
我目前正在抓取大约6周的日历事件。如果数据不存在，它仍然会掩盖页面，我可以使用onScrollEnd通过useQuery查询更多的数据。因此，我试图找到一种方法，如果我可以查询1周值的数据，如果没有足够的数据(比如1-2个事件)来覆盖屏幕(供用户调用onScrollEnd)，然后查询下一批等等，最后再用备忘录包装容器，以帮助提高加载速度我看过各种延迟加载的例子，例
浏览 15提问于2022-08-23得票数 1
在react原生中，FlatList和ScrollView的结构有什么不同？对于应用程序中的滚动视图，它们似乎是相等的，但是ScrollView非常简单，而不是FlatList，那么当我们必须在代码中使用FlatList时呢？
浏览 3提问于2019-03-20得票数 35
回答已采纳
我试图在react原生中实现无限滚动分页。我想在加载时在平面列表组件的底部呈现加载微调器。color="#0000ff" /> ); <View style={styles.container}> onEndReachedThresho
浏览 3提问于2021-12-01得票数 1
当页面向下滚动时，我试图从防火墙加载更多的数据，但它不能正常工作。有很多关于在cloudstore上做这件事的文档，但是没有在实时数据库上这样做，所以我卡住了。问题：
more.Sometimes 在它开始运行时达到了，当它工作时，在3-4滚动底部；它没有调用onendreached no
浏览 2提问于2020-05-30得票数 0
我正在学习对本地的反应，我在上找到了下面的术语。
拜托，有人能说出这是什么意思吗？因为这两份文件都是相反的。
浏览 1提问于2018-10-10得票数 0
回答已采纳
下面的代码运行fetchData，它从我的API中提取数据并将其显示在平面列表中。当我向下滚动平面列表时，API加载页面2，然后加载页面3，等等，无限分页，这是完美的。然而，当我到达我的API数据的末尾时，我得到了这个错误: TypeError: Invalid尝试传播不可迭代的实例，这是一个致命的错误。page: this.state.page
浏览 0提问于2019-11-27得票数 1
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
实时音视频
即时通信 IM活动推荐
腾讯云开发者
