-
Notifications
You must be signed in to change notification settings - Fork 24.8k
Description
Is this a bug report?
Yes
Have you read the Contributing Guidelines?
Yes
Environment
Environment:
OS: Windows 10
Node: 8.1.3
Yarn: 0.27.5
npm: 4.6.1
react-native: 0.49.1
react: 16.0.0-beta.5
Target Platform: iOS and Android
Steps to Reproduce
I am using Flatlist with a very long list of array data, because the items have variable heights, scrolling from bottom to top of the long list will cause jumpiness (due to unmounting/mounting), so I use onLayout on the item view to calculate the height and then pass to the parent component so that every time the item is mounted again, it has the fixed height, thus fix the jumpiness, however the onLayout function does not always return the actual height on some items at the bottom of the list.
- Create a Flatlist with large amount of items
- Each item has the onLayout to calculate the height
- Set the height to the item
Expected Behavior
The onLayout should return the correct height so that the list shows correctly. To clarify, inside each of the item's child, it has to go through a few if-else statements to return what to render. My opinion in this is that it causes a race condition, where the onLayout calculation is called first before all the operation and rendering processes has complete, thereby giving wrong height value. The onLayout should wait for the rendering to complete only then it should do the layout calculation.
Actual Behavior
onLayout returns incorrect value.