React Native：Android端FlatList与ScrollView滚动冲突问题

针对Android端绝对定位的提及列表（ScrollView）滚动时，下方FlatList也跟着滚动的问题，这是Android触摸事件冒泡机制导致的，以下是几个实用的解决办法：

• 给ScrollView添加pointerEvents属性
  在提及列表的ScrollView上设置pointerEvents="box-only"，这个属性会让ScrollView只响应自身区域内的触摸事件，阻止事件透传到下方的FlatList。代码示例：

  <ScrollView
    style={{ position: 'absolute', top: 50, left: 20, right: 20, maxHeight: 200, backgroundColor: '#fff' }}
    pointerEvents="box-only"
  >
    {/* 你的提及列表项 */}
  </ScrollView>
  

• 手动拦截触摸事件
  在ScrollView外层包裹一个View，通过onStartShouldSetResponder方法接管触摸事件，确保滚动事件不会向下传递。代码示例：

  <View
    style={{ position: 'absolute', top: 50, left: 20, right: 20 }}
    onStartShouldSetResponder={() => true}
  >
    <ScrollView style={{ maxHeight: 200, backgroundColor: '#fff' }}>
      {/* 你的提及列表项 */}
    </ScrollView>
  </View>
  

  这个方法的核心是让外层View优先获取触摸事件，避免下方的FlatList接收到滚动信号。

• 额外注意事项
  确保提及列表的zIndex值足够高，避免被其他组件遮挡导致触摸事件无法触发；同时测试不同Android版本，部分旧版本可能需要调整样式或事件处理逻辑。

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