【问题标题】:React Native - stickyHeaderIndices not working for SectionListReact Native - stickyHeaderIndices 不适用于 SectionList
【发布时间】:2020-10-05 08:14:07
【问题描述】:

我正在尝试制作一些标题以粘贴到 SectionList 的顶部,但似乎 stickyHeaderIndices={[0]} 没有按预期工作。这是部分列表:

     <SectionList
          ref={(ref) => (productsSectionListRef = ref)}
          stickyHeaderIndices={[0]}
          ListHeaderComponent={_renderHeader()}
          contentContainerStyle={[style.products_container]}
          sections={productListSections}
          renderItem={({item, section}: {item: string; section: any}) => {
            return _renderProduct(item);
          }}
          stickySectionHeadersEnabled={false}
          renderSectionHeader={({section}) => {
            return _renderProductHeader(section.title);
          }}
          keyExtractor={(item) => item}
          showsVerticalScrollIndicator={false}
          viewabilityConfig={{
            itemVisiblePercentThreshold: 50,
          }}
          onViewableItemsChanged={_onViewableItemsChanged}
          bounces={false}
          scrollEventThrottle={4}
          initialNumToRender={productListSections.length}
          scrollEnabled={scrollEnabled}
          removeClippedSubviews={true}/>

我尝试将标题放在节列表之外,但标题更大,我无法在该标题组件内滚动。

【问题讨论】:

    标签: reactjs react-native react-native-sectionlist react-native-stylesheet


    【解决方案1】:
    stickyHeaderIndices={[0]} 
    

    将使平面列表中的第一个项目粘在顶部 如果你改成

    stickyHeaderIndices={[5]} 
    

    当项目滚动到顶部后,第 4 个项目将粘在顶部

    项目在

    ListHeaderComponent={_renderHeader()}
    

    将在平面列表的顶部,但不作为平面列表中的项目,它是独立的

    【讨论】:

      猜你喜欢
      • 2017-11-12
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2018-12-24
      • 1970-01-01
      • 2022-01-15
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多