reactjs – 如何使React Native FlatList的ListHeaderComponent变粘?

我有一个FlatList,它有目的地比屏幕宽度宽.

该列表垂直滚动以查看每一行,并位于水平ScrollView中以访问屏幕外项目.

ListHeaderComponent prop基本上是一个x轴标签,我想表现为“冻结标题”;就像在电子表格中一样.

如何使ListHeaderComponent变粘?

您需要将prop设置为Flatlist为stickyHeaderIndices = {[0]}

ListHeaderComponent:此prop将标题视图设置在FlatList的顶部.

stickyHeaderIndices = {[0]}:这个prop会将FlatList 0索引位置项设置为粘性标题,你可以看到我们已经将标题添加到FlatList中,所以标题现在位于0索引位置,所以它默认为make标题为粘性.

<FlatList
  data={ this.state.FlatListItems }
  ItemSeparatorComponent={ this.FlatListItemSeparator}
  renderItem={ ({item}) => (
    <Text
      style={styles.FlatList_Item}
      onPress={this.GetItem.bind(this,item.key)}> {item.key}
      </Text>
  )}
  ListHeaderComponent={this.Render_FlatList_Sticky_header}
  stickyHeaderIndices={[0]}
/>

相关文章

导入moment 使用方式 年月日,时分秒 星期几 相对时间 7天后 2小时后 明天 将毫秒转换成年月日
@ 一、前言 为什么介绍redux-actions呢? 第一次见到主要是接手公司原有的项目,发现有之前的大佬在处理...
十大React Hook库 原文地址:https://dev.to/bornfightcompany/top-10-react-hook-libraries-4065 原文...
React生命周期 React的生命周期从广义上分为挂载、渲染、卸载三个阶段,在React的整个生命周期中提供很...
React虚拟DOM的理解 Virtual DOM是一棵以JavaScript对象作为基础的树,每一个节点可以将其称为VNode,用...
React中JSX的理解 JSX是快速生成react元素的一种语法,实际是React.createElement(component, props, ....