flatlist 延伸出屏幕

Question

我的屏幕如下所示：

return (
    <SafeAreaView style={styles.safeAreaViewContainer}>
      <View style={styles.container}>
       ....
        <View style={styles.listContainer}>
          {data && showFlatList !== null && (
            <UsersFoundList
              data={data}
            />
          )}
        </View>
      </View>
    </SafeAreaView>
  );
};

  listContainer: {
    justifyContent: 'center',
    //marginBottom: 50,
  },

我在这里从 UserFoundList 组件调用 FlatList：

  return (
    <View>
      <FlatList
        data={data.user}
        horizontal={false}
        scrollEnabled
        renderItem={({ item }) => (
          <UserFoundEntry user={item} onSendRequest={onSendRequest} />
        )}
        keyExtractor={(item) => item?.id?.toString()}
        ListEmptyComponent={NoUsersFoundTextBox}
      />
    </View>
  );
};

但列表与底部的 safeAreaView 重叠。滚动时，它应该从 behind/under SafeAreaView 出现，而​​不是在它的顶部。

Answer 1

尝试在 listContainer 样式中使用 flex: 1，这应该会使其保持在父视图的边界内。