React Native ScrollView，onEndReached没有触发答案

【问题标题】：React Native ScrollView, onEndReached is not triggeringReact Native ScrollView，onEndReached没有触发
【发布时间】：2019-09-25 09:23:51
【问题描述】：

我正在尝试为我的 ScollView 创建一个“加载更多”功能。目前我有一个按钮，按下该按钮会将更多元素加载到 ScrollView 中。这一切都按预期工作。但是，我现在试图在用户接近 ScrollView 的末尾时触发它，但不幸的是该函数没有触发。我尝试更改 onEndReachedThreshold 的值（更大和更小），但没有成功。我在下面粘贴了我的模块返回。非常感谢所有帮助。

return (

        <View style={{ width: "100%", height: "100%" }}>
            <ScrollView showsVerticalScrollIndicator={false} onEndReachedThreshold={10} onEndReached={() => { console.log("end reached"); this.props.pEnd ? this.props.loadMore() : null }} refreshControl={<RefreshControl refreshing={this.props.refreshing} onRefresh={() => { this.props.getData(0) }} />} style={{ width: "100%", flexDirection: "column" }}>

                <View style={{ height: 10, width: "100%" }}></View>
                {scrollables}
                {this.props.pEnd ? null : <View style={{ height: 25, width: "100%", flexDirection: "row", justifyContent: "center", alignItems: "center" }}>
                    <TouchableOpacity
                        style={{ height: "100%", width: 100, backgroundColor: "white", borderRadius: 20, padding: 2, justifyContent: "center", alignItems: "center" }}
                        onPress={() => { this.props.loadMore() }}>
                        <Text>Load Older...</Text>
                    </TouchableOpacity>
                </View>}


                <View style={{ width: "100%", height: "10%", paddingBottom: "20%" }}></View>
            </ScrollView>

        </View>);

【问题讨论】：

ScrollView 没有道具 onEndReached，Flatlist 有。请查看Docs
亲爱的你可以使用的 onScroll 属性。更多参考medium.com/@yangnana11/…
为什么你有 View 作为滚动的父级？不要使用 "%" 你可以使用 flex: 1 代替。而ScrollView 没有 onEndReached 道具使用 FlatList。继续练习（Y）
将 View 作为父级有什么问题，为什么建议使用 flex:1？

标签： react-native scrollview react-native-scrollview

【解决方案1】：

请记住，您的 FlatList 不应位于 ScrollView 组件中。我花了一整天的时间来解决这个问题，这只是一个小错误。所以，我认为你们也避免在任何 ScrollView 组件中使用 Flatlist

【讨论】：