オートコンプリート アイテムのリストを表示する AutoComplete Box があります。アイテムを FlatList に表示し、FlatList の周囲に境界線も表示します。コードは次のとおりです: -
render(){
return (
<View>
<TextInput
clearButtonMode="while-editing"
onChangeText={this.onChangeText}
value={this.state.searchText}
onSubmitEditing={this.onTextSubmitted}
placeholder="Find..." />
{this.state.data.length > 0 &&
<FlatList
style={styles.list}
keyboardShouldPersistTaps="handled"
data={this.state.data}
ItemSeparatorComponent={this.renderSeparator}
keyExtractor={item => item.properties.id}
renderItem={this.renderItem} />});
}
const styles = StyleSheet.create({
list: {
borderWidth: 16,
borderColor: colors.searchBorder,
},
});
リスト項目の数に応じて FlatList のサイズを増減するにはどうすればよいですか (このエラーの原因は境界線にあると思います)。
ベストアンサー1
flexGrow: 0
リスト スタイルに追加します。