当我们在 react native 中快速滚动时，Flatlist 显示空白屏幕答案

【问题标题】：Flatlist show blank screen when we do fast scroll in react native当我们在 react native 中快速滚动时，Flatlist 显示空白屏幕
【发布时间】：2021-11-16 20:24:05
【问题描述】：

我在平面列表中显示视频，但是当我快速滚动时，它会显示一段时间的空白屏幕，一段时间后它会显示正确的内容。我正在使用功能组件。

【问题讨论】：

请提供足够的代码，以便其他人更好地理解或重现问题。

标签： javascript ios reactjs react-native react-hooks

【解决方案1】：

FlatList 只会在其可见时加载内容，如果您想预加载它，请改用 ScrollView。

【讨论】：

【解决方案2】：

你可能想看看这个，这些文档包含了在滚动平面列表时避免出现白屏的所有事情：

https://reactnative.dev/docs/optimizing-flatlist-configuration

我会建议“windowSize”道具：

更大的 windowSize 将导致滚动时看到空白空间的机会更少。另一方面，较小的 windowSize 会导致同时挂载的项目更少，从而节省内存。

【讨论】：

是的，我已经关注了优化平面列表，但是当我加快滚动速度时，它仍然显示空白屏幕。
如果你的图片很重，可以试试github.com/DylanVann/react-native-fast-image。
是的，我已经在使用 react-native-fast-image 作为服务器图像，使用 react-native-video 作为服务器视频 url，我在 Flatlist 中都显示图像和视频。