ScrollView 内的 FlatList 不滚动

问题描述

我有一个要求，其中个人资料数据将位于顶部，而提要将在此之后出现。在滚动提要时，配置文件部分也应该滚动。表示需要滚动整个页面。

所以我在 ScrollView 中实现了 FlatList。

<ScrollView
        contentContainerStyle={{ flex: 1 }}>
        <FlatList
          showsverticalScrollIndicator={false}
          showsHorizontalScrollIndicator={false}
          data={this.state.Feed}
          keyExtractor={(item,index) => item.id}
          refreshControl={this.refreshControl()}
          renderItem={({ item,index }) => this.renderItem(item,index)}
          numColumns={2}
          ListFooterComponent={this.renderFooter.bind(this)}
          onEndReachedThreshold={0.4}
          onEndReached={this.handleLoadMore.bind(this)} />
</ScrollView> 

但我无法滚动页面。

如果我删除 contentContainerStyle={{ flex: 1 }}，那么 handleLoadMore 函数会不断调用自身。

感谢您的任何建议！

解决方法

试试这个

  <ScrollView
    contentContainerStyle={{flexGrow:1}}
        scrollEventThrottle={200}
        directionalLockEnabled={true}
    >
 <FlatList
          showsVerticalScrollIndicator={false}
          showsHorizontalScrollIndicator={false}
          data={this.state.feed}
          keyExtractor={(item,index) => item.id}
          refreshControl={()=>this.refreshControl()}
          renderItem={({ item,index }) => this.renderItem(item,index)}
          numColumns={2}
          ListFooterComponent={(e)=>this.renderFooter.bind(e)}
          onEndReachedThreshold={0.4}
          onEndReached={(e)=>this.handleLoadMore.bind(e)} />



use Callback like this. //

()=>this.yourFUNC()

or

this.yourFUNC()