Using initialScrollIndex with Flatlist will cause missing items with react native
Description
When using initialScrollIndex with react native, the first few items in the dataset will not get rendered. It is impossible to see these items, even by scrolling back up.
(note: this is just a refiling of this issue which was just ignored 😞 https://github.com/facebook/react-native/issues/30387)
Steps to reproduce
- render <10 items with Flatlist
- set scroll index
React Native Version
0.74.1
Affected Platforms
Runtime - Android
Output of npx react-native info
info Fetching system and libraries information...
System:
OS: macOS 14.4
CPU: (8) arm64 Apple M1
Memory: 111.80 MB / 16.00 GB
Shell:
version: "5.9"
path: /bin/zsh
Binaries:
Node:
version: 20.10.0
path: ~/.nvm/versions/node/v20.10.0/bin/node
Yarn:
version: 1.22.19
path: /opt/homebrew/bin/yarn
npm:
version: 10.2.3
path: ~/.nvm/versions/node/v20.10.0/bin/npm
Watchman:
version: 2024.01.22.00
path: /opt/homebrew/bin/watchman
Managers:
CocoaPods:
version: 1.15.2
path: /opt/homebrew/bin/pod
SDKs:
iOS SDK:
Platforms:
- DriverKit 23.4
- iOS 17.4
- macOS 14.4
- tvOS 17.4
- visionOS 1.1
- watchOS 10.4
Android SDK:
API Levels:
- "28"
- "30"
- "31"
- "33"
- "34"
Build Tools:
- 30.0.3
- 33.0.0
- 33.0.1
- 34.0.0
System Images:
- android-33 | Google Play ARM 64 v8a
Android NDK: Not Found
IDEs:
Android Studio: 2023.2 AI-232.10300.40.2321.11567975
Xcode:
version: 15.3/15E204a
path: /usr/bin/xcodebuild
Languages:
Java:
version: 17.0.7
path: /usr/bin/javac
Ruby:
version: 2.6.10
path: /usr/bin/ruby
npmPackages:
"@react-native-community/cli": Not Found
react:
installed: 18.2.0
wanted: 18.2.0
react-native:
installed: 0.74.1
wanted: 0.74.1
react-native-macos: Not Found
npmGlobalPackages:
"*react-native*": Not Found
Android:
hermesEnabled: true
newArchEnabled: false
iOS:
hermesEnabled: true
newArchEnabled: false
Stacktrace or Logs
none
Reproducer
https://snack.expo.io/@divone/initialscrollindex-does-not-show-all-items
Screenshots and Videos
No response
| :warning: | Missing Reproducible Example |
|---|---|
| :information_source: | We could not detect a reproducible example in your issue report. Please provide either:
|
Have you tried adding the keyExtractor prop? I had a similar issue where I couldn't access first and last indices of a FlatList - needed to add the keyExtractor and it fixed it for me.
I'm having same issue.. I upgraded RN 0.69.7 -> 0.74.1 and this issue appeared..
I found a temporary solution.
Not showing item over 10 issue occurred when initial list length is 0.
So, In my case, this code works for me... before the flatlist
if (list.length === 0) return null
But.. It is so inconvenient and I think it's an error
I found solution from here
This issue is waiting for author's feedback since 24 days. Please provide the requested feedback or this will be closed in 7 days.
This issue was closed because the author hasn't provided the requested feedback after 7 days.