react-native - ScrollView 内的 FlatList 不滚动
问题描述
我有 4FlatList
秒,其中maxHeight
设置200
为ScrollView
.
<ScrollView>
<FlatList/>
<FlatList/>
<FlatList/>
<FlatList/>
</ScrollView>
当我尝试滚动 aFlatList
时,它不会滚动,而是ScrollView
滚动。我该如何解决这个问题?
完整的源代码
import { Component, default as React } from 'react';
import { FlatList, ScrollView, Text } from 'react-native';
export class LabScreen extends Component<{}> {
render() {
return (
<ScrollView>
{this.renderFlatList('red')}
{this.renderFlatList('green')}
{this.renderFlatList('purple')}
{this.renderFlatList('pink')}
</ScrollView>
);
}
getRandomData = () => {
return new Array(100).fill('').map((item, index) => {
return { title: 'Title ' + (index + 1) };
});
};
renderFlatList(color: string) {
return (
<FlatList
data={this.getRandomData()}
backgroundColor={color}
maxHeight={200}
marginBottom={50}
keyExtractor={(item, index) => index.toString()}
renderItem={({ item }) => <Text>{item.title}</Text>}
/>
);
}
}
解决方案
我们可以为子 FlatList/ScrollView 组件使用内置的nestedscrollenabled属性。
<FlatList nestedScrollEnabled />
这仅对 Android 是必需的(iOS 默认支持嵌套滚动)。
推荐阅读
- julia - 如何更改代码以便解决模型?
- ios - 为什么 SceneKit CPU 使用率这么高?
- javascript - 我的 useReducer 钩子不会只更新一种调度类型的状态
- sql - SQL Partition By 计算净值
- c# - 如何在不使用内联映射或多个 .ForMember 的情况下在 automapper 中映射嵌套对象?
- jquery - 如何在我的动态表单中增加属性“for”?
- python - Python 打不开 JSON 文件,报 JSONDecodeError
- c - 我收到有关返回类型不兼容的警告
- reactjs - Reactjs 无法直接导航到 url(Springboot 后端)
- python - 在 jupyter notebook 中导入 sklearn 时出现操作系统错误