React native 在ScrollView中对ListView进行本机分页？

我在一个

ScrollView

组件中有3个

ListView

组件，如下所示：

<ScrollView>
  <Header />
  <ListView onEndReached={() => alert('load more 1')}/>
  <ListView onEndReached={() => alert('load more 2')}/>
  <ListView onEndReached={() => alert('load more 3')}/>
  <Footer />
</ScrollView>

警报（'load more 1'）}/>
警报（'load more 2'）}/>
警报（'load more 3'）}/>

标题

组件有一些公共内容，还有3个选项卡，它们触发显示相应的

列表视图

问题是任何

ListView

带有

onEndReached={（）=>alert（'load more 1'）}

都不会运行该警报，因此我无法在向下滚动并点击ListView的末尾时加载更多。删除包装

ScrollView

，警报就会运行，但是公共

标题不会滚动，因为我们刚刚删除了包装
ScrollView
。标题需要与listview一起滚动，这就是为什么我在
ScrollView
中包装了所有需要滚动的内容

重要提示：
对于这种情况，我不能将
ListView
与
renderHeader={this.header}
一起使用。因为，即使
标题
会滚动，它也会在每次呈现
列表视图
时重新呈现公共
标题
和每个
列表视图
的3个选项卡，而不是一次。因此，每次为每个
ListView
重新加载一个新的
标题
不会为应用程序剪切它

要寻找此问题的解决方案，当
标题
与列表视图一起滚动时，对于可见的
列表视图
，您可以在样式设置中将其位置设置为相对于top:0和left:0。这样，它将在顶部保持静态

<View>
<Header style={{position:"relative",top:0,left:0,height:30,width:Dimensions.get("window").width}} />
  <ListView />
  <ListView />
  <ListView />
 <Footer />
 </View>



在scrollview中可能起作用的第二个选项是为所有三个ListView指定高度。
我认为您必须通过更改每个ListView中的数据源来解决这个问题，以响应所选择的header元素，而不是加载三个不同的ListView

getInitialState() {
    return {
        currentList: this.ds.cloneWithRowsAndSections(INITIAL_DATA);
    }
},
render() {
    return <ListView renderHeader={this._renderHeader} dataSource={this.state.currentList}/>
}

getInitialState（）{
返回{
当前列表：this.ds.cloneWithRowsAndSections（初始数据）；
}
},
render（）{
返回
}

您不想这样做的唯一原因是，如果您想在三个子ListView中保持滚动位置，但这不会有用，因为您始终必须滚动到顶部才能更改正在查看的ListView

然后，在您的
\u renderHeader
函数中，您将呈现一个选择器，该选择器根据所选的标题使用不同的数据填充
currentList
。
您可以使用
ScrollView:：onScroll
，但这会有点麻烦。您需要知道ListView的大小

仅使用ListView
也许最好的解决方案是使用
ListView
dataSource和
onedreached
函数

如果在触发
ListView:：onEndReached
时更新数据集，我认为可以向ListView添加更多元素。这样，您就不必对ScrollView中的ListView进行任何不规范的操作。
谢谢您的回复。选项1不会滚动
标题
，因为它不在滚动视图中，我需要在向下滚动时滚动标题。我的意思是静态的，它不应该被重新命名，但仍然和主体一起滚动。选项2，它是一个动态大小，随着您的移动会加载更多，因此不确定高度将如何工作。在标题选项卡之间切换时，您是否需要标题选项卡来设置动画（例如，该示例显示了顶部和底部的动画），如果您不需要标题来设置动画-为什么在每个ListView中重新渲染标题会对您造成问题，只要状态持续存在？@Luke Rhodes切换时不需要设置标题动画，但我不希望在选项卡更改时为每个列表视图重新渲染标题，因为重新渲染时标题的位置显示为白色，但只有底部部分（listview）应该随着选择的相应选项卡而改变。问题是它可能是列表视图项的动态高度（每个元素的高度可能稍有不同），因此解决方案需要灵活。仅使用ListView也不会滚动标题，请参阅相关重要注意事项，了解仅使用ListView时标题重新呈现的问题。是！标题现在与内容一起滚动，在我到达底部时加载更多内容，并且在重新呈现listview时不会“白色闪烁”标题。伟大的解决方案！谢谢你，弗兰克：）