-
Notifications
You must be signed in to change notification settings - Fork 24.8k
Closed
Labels
BugComponent: FlatListPlatform: LinuxBuilding on Linux.Building on Linux.Resolution: LockedThis issue was locked by the bot.This issue was locked by the bot.
Description
Environment
Environment:
OS: Linux 4.15
Node: 8.11.2
Yarn: 1.7.0
npm: 5.6.0
Watchman: 4.9.0
Xcode: N/A
Android Studio: 3.1 AI-173.4720617
Packages: (wanted => installed)
react: 16.3.1 => 16.3.1
react-native: 0.55.4 => 0.55.4
Description
I've 4 FlatList
s with maxHeight
set to 200
inside a ScrollView
.
<ScrollView>
<FlatList/>
<FlatList/>
<FlatList/>
<FlatList/>
</ScrollView>
and when I try to scroll a FlatList
, it doesn't scroll but the ScrollView
scrolls. How do I fix this issue ?
Full Source Code
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>}
/>
);
}
}
Reproducible Demo
Metadata
Metadata
Assignees
Labels
BugComponent: FlatListPlatform: LinuxBuilding on Linux.Building on Linux.Resolution: LockedThis issue was locked by the bot.This issue was locked by the bot.