React Native中SwipeListView导致滚动失效的解决方案咨询

我在React Native应用中使用react-native-swipe-list-view包的SwipeListView实现列表项滑动功能，代码如下：

<View>
  <SwipeListView
    data={listData.filter((item) => typeof item['approved'] === "undefined")}
    renderItem={renderSwipeItem}
    keyExtractor={item => item.id.toString()}
    onRowDidOpen={(rowKey, rowMap) => {}}
    disableRightSwipe={false} // 允许右滑，避免误触关闭
    disableLeftSwipe={false} // 允许左滑，避免误触关闭
    renderHiddenItem={() => <></>} // 不需要隐藏按钮
    rightOpenValue={-75} // 设置触发关闭的滑动值
    leftOpenValue={75} // 设置触发关闭的滑动值
    onSwipeValueChange={handleSwipeValueChange}
  />
</View>

列表项滑动功能正常，但滑动第一个列表项后无法向下滚动。用React Native的<ScrollView>包裹后滚动问题解决，但出现以下错误：

ERROR: VirtualizedLists should never be nested inside plain ScrollViews with the same orientation because it can break windowing and other functionality - use another VirtualizedList-backed container instead. 

解决办法 #

1. 修复原有SwipeListView的滚动问题（无需嵌套ScrollView） #

SwipeListView本身基于VirtualizedList，自带滚动能力，滚动失效大概率是父容器样式限制导致的：

• 给包裹SwipeListView的<View>添加flex: 1样式，让SwipeListView能占据足够的可用空间：

<View style={{flex: 1}}>
  <SwipeListView
    // 保留原有配置
  />
</View>

• 检查handleSwipeValueChange函数逻辑，确保没有在滑动时意外修改了影响滚动的状态或属性。
• 可显式设置scrollEnabled={true}（默认值为true，但显式声明可排除配置异常）。

2. 替代组件推荐（均基于VirtualizedList） #

如果react-native-swipe-list-view问题无法解决，可尝试以下替代方案：

• @react-native-community/swipe-list-view：原包的社区维护版本，兼容性更好，用法和原包几乎一致。
• react-native-swipeable-item：可配合FlatList（基于VirtualizedList）使用，灵活性更高，示例代码：

import { FlatList } from 'react-native';
import SwipeableItem from 'react-native-swipeable-item';

<FlatList
  data={listData.filter((item) => typeof item['approved'] === "undefined")}
  keyExtractor={item => item.id.toString()}
  renderItem={({ item }) => (
    <SwipeableItem
      leftOpenValue={75}
      rightOpenValue={-75}
      onSwipeValueChange={handleSwipeValueChange}
    >
      {/* 你的列表项内容，即原来renderSwipeItem返回的组件 */}
    </SwipeableItem>
  )}
/>

内容的提问来源于stack exchange，提问作者JS_is_awesome18