React Native 0.71.3升级后react-native-popover-view内嵌ScrollView安卓失效

RN升级到0.71.3后，安卓端popover里的ScrollView没法滚动，但iOS正常，之前版本没问题，大概率是触摸事件冲突或者布局计算问题，试试下面几个方案：

方案1：给ScrollView开启嵌套滚动（安卓专属） #

安卓端需要显式开启嵌套滚动支持，让ScrollView能正确捕获滚动事件，给ScrollView加nestedScrollEnabled={true}属性：

<ScrollView
  nestedScrollEnabled={true}
  contentContainerStyle={{ flexGrow: 1, paddingTop: 20 }}
>
  {[...new Array(100)].map((item, index) => (
    <Text key={index}>{`${index}. Welcome to React native`}</Text>
  ))}
</ScrollView>

方案2：给Popover设置明确高度 #

如果Popover没有固定高度，安卓端的ScrollView可能无法正确计算可滚动区域，直接给Popover加height属性：

<Popover
  from={( 
    <TouchableOpacity>
      <Text>Press here to open popover!</Text>
    </TouchableOpacity>
  )}
  height={400} // 设固定高度，也可以用屏幕比例动态计算
>
  {/* ScrollView内容 */}
</Popover>

要是想适配不同屏幕，也可以用Dimensions动态获取高度：

import { Dimensions } from 'react-native';
const screenHeight = Dimensions.get('window').height;

// ...

<Popover
  from={/* 触发元素 */}
  height={screenHeight * 0.6} // 占屏幕60%高度
>
  {/* ... */}
</Popover>

方案3：升级react-native-popover-view版本 #

可能是这个库未适配RN 0.71，先升级到最新版试试：

npm update react-native-popover-view
# 或者用yarn：yarn upgrade react-native-popover-view

如果升级后还是有问题，可以查看库的issues是否有同款问题，或者手动调整库的容器触摸事件逻辑。

方案4：换用FlatList替代ScrollView #

要是上面的方法都没用，试试用FlatList代替ScrollView，它在安卓端的滚动事件处理更稳定，记得加上嵌套滚动属性：

<FlatList
  data={[...new Array(100)]}
  renderItem={({ index }) => (
    <Text key={index}>{`${index}. Welcome to React native`}</Text>
  )}
  keyExtractor={(item, index) => index.toString()}
  contentContainerStyle={{ paddingTop: 20 }}
  nestedScrollEnabled={true}
/>

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