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

[thanhluantl2304]

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]

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]

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]

Has anyone ever found any solution yet?

[DhrupalRafaliya]

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}