时间戳

首页 > 解决方案 > VirtualizedLists 永远不应该嵌套错误

react-native - VirtualizedLists 永远不应该嵌套错误

问题描述

我正在使用 React Native 构建一个移动应用程序，并且我有一个ScrollView内部页面。

问题是我在这个页面中有一个FlatList所以当我去那个页面时，我得到了这个错误： VirtualizedLists should never be nested inside plain ScroolViews with the same orientation...问题是，我设置了ScrollView nestedScrollEnabled，true我也设置了FlatList's scrollEnabled，false因为我真的不需要那里的滚动（我' m 使用它来呈现枚举中的项目）所以我认为应该修复错误，但错误仍然存​​在。

它看起来像这样：

<ScrollView showsVerticalScrollIndicator={false} nestedScrollEnabled={true}>
  <MyComponent />
</ScrollView>

并且MyComponent有这个 FlatList：

<FlatList
    scrollEnabled={false}
    style={{padding: 8,marginBottom: 8,}}
    data={categories}
    numColumns={numOfColumns}
    keyExtractor={category => category}
    renderItem={item => renderItem(item.item)}
/>

标签： react-native

解决方案

您可以尝试将属性添加nestedScrollEnabled={true}到父母和孩子：

<ScrollView showsVerticalScrollIndicator={false} nestedScrollEnabled={true}>
  <MyComponent />
</ScrollView>

<FlatList
    nestedScrollEnabled={true}
    scrollEnabled={false}
    style={{padding: 8,marginBottom: 8,}}
    data={categories}
    numColumns={numOfColumns}
    keyExtractor={category => category}
    renderItem={item => renderItem(item.item)}
/>

推荐阅读