renderItem is not being called after switching from FlatList
See original GitHub issueI’ve installed BigList and followed the ‘Migrate from FlatList’ guide, after which the component looks like this:
console.log('about to try to use biglist'); // This shows up
<BigList
data={item}
renderItem={(item) => {
console.log('WITHIN RENDERITEM'); // This never shows up in console
return <MenuListItem
food={item.item}
navigation={this.props.navigation}
onItemPress={() => {
this.props.dispatch(loadCurrentMenuItem('fooditem', item.item));
this.props.navigation.navigate('ViewFoodItem', {
fid: item.item.id
});
}}
/>
}}
itemHeight={50}//swapped out the const just to show the current value
keyExtractor={(item, index) => index.toString()}
/>
No items are rendered and that console.log() within the renderItem function never shows up.
If I switch back to FlatList and remove the itemHeight property everything is displayed properly again.
In the migration guide it specifically says “The main props of FlatList are compatible with BigList like data”. Are there exceptions to that? Does it not extend to renderItem and I need to download the examples to see how the needs of that have changed?
I should also ask since this is mentioned on the front page: ‘When list can’t render your items fast enough the non-rendered components will appear as blank space.’ Since I am currently experiencing this problem with categories further down my list being blank, will BigList do anything to fix that or will it have the same problems FlatList has? I saw another issue elsewhere mention that they were still having the same blank space issues while using this plugin.
Thanks.
Issue Analytics
- State:
- Created 2 years ago
- Reactions:3
- Comments:11 (2 by maintainers)
Top GitHub Comments
I was able to resolve the issue by downgrading to version 1.5.0 and also by adding a height of 100% to the view above BigList.
Same issue over here.