1
私はFlatList（つまりScrollView）内に配置したいデータのリストを持っています。リストの多くを表示するためにスクロールしようとするたびに、ScrollViewはリストの一番上を見ることはできません。ネイティブScrollView/FlatListがスクロールしないようにします
私はExpoを使用しています。奇妙なことは、新しいプロジェクトを作成したり、Snackにいくつかのコードをコピー/ペーストしてもスクロールが正常に機能することです。現在のプロジェクトでは、リストをスクロールすることはできません。私はmain.jsファイルに行って、そこにサンプルコードを貼り付けても問題は解決しません。
私のサンプルコードはここにあります：https://snack.expo.io/ryDPtO5-b 私はこの正確なコードを自分のプロジェクトに貼り付けており、期待どおりに動作していません。
バージョン： RN 0.44/ エキスポSDK 17.0.0/ が反応：私のプロジェクトのための16.0.0-alpha.6
私の実際のユースケースは、下部三分のでFlatListコンポーネントを配置することを含みますジョブのリストを表示する画面。これがエラーを発見した場所で、問題をデバッグしようとしたときです。私のプロジェクトで、私はFlatListが含まれているListの子を持つ{flex: 1のスタイルを持つ親Viewを持っている... Listはreact-native-elements
EDIT
から来てここで私が実際に使用しようとしていますコードです：
<View style={styles.container}>
<View style={containerStyles.headerContainerStyle}>
<Text style={[textStyles.h2, { textAlign: 'center' }]}>
Territory: {this.props.currentTerritory}
</Text>
</View>
<View style={styles.mapContainer}>
<MapView
provider="google"
onRegionChangeComplete={this.onRegionChangeComplete}
region={this.state.region}
style={{ flex: 1 }}
>
{this.renderMapMarkers()}
</MapView>
</View>
<Badge containerStyle={styles.badgeStyle}>
<Text>Orders Remaining: {this.props.jobsList.length}</Text>
</Badge>
<List containerStyle={{ flex: 1 }}>
<FlatList
data={this.props.jobsList}
keyExtractor={item => item.id}
renderItem={this.renderJobs}
removeClippedSubviews={false}
/>
</List>
</View>
そして、すべての私のスタイル
const styles = StyleSheet.create({
container: {
flex: 1,
},
mapContainer: {
height: 300,
},
badgeStyle: {
backgroundColor: 'green',
alignSelf: 'center',
marginTop: 15,
width: 300,
height: 35,
},
}）;
そして最後に、私のRenderItem機能：
renderJobs = ({ item }) => {
const { fullAddress, pickupTime } = item;
return (
<ListItem
containerStyle={item.status === 'active' && { backgroundColor: '#7fbf7f' }}
title={fullAddress}
titleStyle={{ fontSize: 14 }}
subtitle={pickupTime}
subtitleStyle={{ fontSize: 12, color: 'black' }}
onPress={() => this.props.navigation.navigate('jobActions', { job: item })}
/>
);
}
コードに外部リンクを提供しないでください。代わりにMCVEを作成してください： – CinCout