bogoslavskiy / react-native-tabs-section-list

React Native SectionList with scrollable tabs
MIT License
131 stars 40 forks source link

Can not switch page if switch tab when data is large! #2

Open thanhluantl2304 opened 4 years ago

thanhluantl2304 commented 4 years ago

If one section's data is too large, I can't switch to other tab's page. Any one can help me about that problem?

markrickert commented 4 years ago

I'm running into this issue as well. Turns out that <SectionList> does some lazy loading and we have to account for it. I found that implementing this library and adjusting the heights of things to meet my needs resolved my problem:

https://www.npmjs.com/package/react-native-section-list-get-item-layout

This happens when the list is too long and you tap a tab for a section that's not loaded. I'd also recommend adding this to your sectionlist to prevent crashes from this:

    <SectionList
      onScrollToIndexFailed={() => { }}
      {...}
    />
cristaken commented 4 years ago

I'm running into this issue as well. Turns out that <SectionList> does some lazy loading and we have to account for it. I found that implementing this library and adjusting the heights of things to meet my needs resolved my problem:

https://www.npmjs.com/package/react-native-section-list-get-item-layout

This happens when the list is too long and you tap a tab for a section that's not loaded. I'd also recommend adding this to your sectionlist to prevent crashes from this:

    <SectionList
      onScrollToIndexFailed={() => { }}
      {...}
    />

I researched through this npm library but without make it works yet, can you explain or put a example here please?

My problem is explained here: https://stackoverflow.com/questions/62942569/how-to-configure-getitemlayout-prop-for-sectionlist-with-dynamic-height

butri71 commented 1 year ago

Has anyone ever found any solution yet?

DhrupalRafaliya commented 9 months ago

Add the length of your list here and the issue will be solved and the length will be

const length=data&&data?.flatMap(item=>item?.dish_detail).length+data?.length*2

  initialNumToRender={length}
  maxToRenderPerBatch={length}