Issue: Auto scroll to Top in react-native-collapsible-tab-view

[yadavmurari111]

I'm having auto scroll to top in the flatlist issue when :- reached to the bottom most item of flatlist and api returns the data and it set's to the setdata of the flatlist. This issue is only in "tab1", other tabs are fine. video is also attached in reference of the issue. Please help me out.

[andreialecu]

I see that the header is stuck in the video, that shouldn't happen, so other things seem wrong here. Is that a FlatList or ScrollView? Can you share some relevant code?

[yadavmurari111]

Tabs.Container

     <Tabs.Container
      cancelLazyFadeIn
      allowHeaderOverscroll
      snapThreshold={0.9}
      headerHeight={contentHeight}
      initialTabName="tab1"
      lazy
      cancelTranslation
      tabBarHeight={70}
      renderHeader={renderHeader}
      onTabChange={result => setCurrentTab(result.tabName)}>
      <Tabs.Tab name="tab1">
        <Tabs.FlatList
          style={{backgroundColor: presetBase.colors.white}}
          bounces
          refreshControl={
            <RefreshControl
              refreshing={refreshing}
              onRefresh={reload}
              colors={[presetBase.colors.blueBase]}
            />
          }
          data={tabData}
          onEndReached={loadMore}
          initialNumToRender={40}
          renderItem={rendActivity}
          onEndReachedThreshold={0.8}
          ListHeaderComponent={renderTabHeader}
          ItemSeparatorComponent={itemSeparator}
          ListEmptyComponent={() => handleEmpty(hasNextPage)}
          ListFooterComponent={() => listFooterComponent(hasNextPage)}
          keyExtractor={(_item, index) => index.toString()}
        />
      </Tabs.Tab>
     <Tabs.Tab name="tab2">
        <Tabs.FlatList/> ---> same as tab1 with different data
     </Tabs.Tab>

[nickcherry]

I am also experiencing this issue with 5.0.0-rc.13, however it is happening on all tabs – not just the first tab. The undesirable scroll-to-top happens when the onEndReached callback updates the component's state, triggering a re-render. I'm not entirely certain, but I think this may only be happening when a snapThreshold is defined.

[LinceMathew]

use this https://www.npmjs.com/package/react-native-collapsible-with-infinite-scroll

[DSKonstantin]

Any updates?

[sangmin-iam]

Any updates?