How to do "position: sticky" on React Native-CodePudding

I can't find how to do something like this https://codepen.io/dexnick4501/pen/dyKzGKq on react native.

I tried the method ScrollView stickyHeaderIndices. He can't take a sub element

<ScrollView stickyHeaderIndices={[0]}>
<View> <-- Here element select
  <Header /> <-- Here element not select
</View>
</ScrollView>

CodePudding user response：

Use SectionList with stickySectionHeadersEnabled. Something like this

<SectionList
  sections={DATA}
  keyExtractor={(item, index) => item   index}
  renderItem={({ item }) => (
    <Text style={styles.item}>{item}</Text>
  )}
  stickySectionHeadersEnabled={true}
  renderSectionHeader={({ section: { title } }) => (
    <Text style={styles.header}>{title}</Text>
  )}
/>