ReactNative: SectionList SectionHeaders перезаписывает ListFooter - PullRequest
Новая
       19

ReactNative: SectionList SectionHeaders перезаписывает ListFooter

0 голосов
/ 16 апреля 2020

У меня есть собственная страница React, которая содержит основной компонент SectionList. В SectionList есть липкие заголовки разделов (stickySectionHeadersEnabled) и нижний колонтитул списка (ListFooterComponent). Когда пользователь прокручивает последний раздел, заголовок последнего раздела остается наверху страницы, перезаписывая нижний колонтитул. Однако я бы предпочел, чтобы липкие заголовки содержались в теле области списка разделов и не оставались на экране после конца последнего раздела.

Возможно ли добиться этого с помощью SectionList или я должен взять другой подход?

Экспо-закуска, демонстрирующая это поведение (только iOS & Android)

https://snack.expo.io/@unstableair / rn-sectionlist-footer-overlay-example 

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

1 Ответ

0 голосов
/ 18 апреля 2020

Чтобы обойти эту проблему, я добавил пустой раздел внизу данных SectionList. Последний SectionHeader по-прежнему перезаписывает ListFooter, но, поскольку это View с высотой 0, вы его не видите.

...