时间戳

首页 > 解决方案 > React Native Scrolling 列表在 Android 的可滚动视图中不起作用

react-native - React Native Scrolling 列表在 Android 的可滚动视图中不起作用

问题描述

我的 React Native 应用程序有一个长视图，该视图显示可滚动列表。

  const TOTAL_LISTS = 20;
  const lists = [];
  for (let i = 0; i < TOTAL_LISTS; i++) {
    lists.push(
      <ScrollView style={{ height: 50, margin: 10 }}>
        <Text>1</Text>
        <Text>2</Text>
        <Text>3</Text>
        <Text>4</Text>
        <Text>5</Text>
      </ScrollView>
    );
  }

  return (
    <ScrollView scrollEventThrottle={10}>
      <Text>Before Text</Text>
      <Text>Before Text2</Text>
      {lists}
      <Text>After Text</Text>
      <Text>After Text2</Text>
    </ScrollView>
  );

如果主视图没有超出屏幕视图（例如 TOTAL_LISTS = 2），那么列表对于 Android 仍然是可滚动的。但是，如果主视图超出屏幕（例如 TOTAL_LISTS = 20），则列表不可滚动，因为它仅滚动主视图。这不会发生在 IOS 设备上。

我正在使用小米安卓10。

有没有办法解决这个问题？

标签： react-nativereact-native-android

解决方案

https://stackoverflow.com/a/51934761/5733033

<ScrollView {...parentProps}>
  <ScrollView {...childProps} nestedScrollEnabled={true}>
  </ScrollView>
</ScrollView>

推荐阅读