React-native：フラットリストアイテムをラップする方法

Question

クエリによって返される用語のリストがあります。それぞれは単一の単語です。現在、私のFlatListは各単語を同じ行のボタンにレンダリングします（horizo​​ntal = {true}） 普通のテキストのようにボタンを折り返したいと思います。しかし、それは自然のように見えないので、私は絶対に列の機能を使いたくありません。 これはFlatListの悪いユースケースですか？私が使用できる他のコンポーネントはありますか？私が得ているとりわけ

const styles = StyleSheet.create({ 
    flatlist: { 
    flexWrap: 'wrap' 
    }, 
    content: { 
    alignItems: 'flex-start' 
    }}) 

render() { 

    return (
     <Content> 
     <Header searchBar rounded iosStatusbar="light-content" androidStatusBarColor='#000'> 
      <Item> 
      <Icon name="ios-search" /> 
      <Input onChangeText={(text) => this.setState({searchTerm: text})} value={this.state.searchTerm} placeholder="enter word"/> 
      <Icon name="ios-people" /> 

      <Button transparent onPress={this._executeSearch}> 
      <Text>Search</Text> 
      </Button> 
      </Item> 
     </Header> 

     <FlatList style={styles.flatlist} contentContainerStyle={styles.content} 
      horizontal={true} data={this.state.dataSource} renderItem={({item}) => 
        <Button> 
        <Text>{item.key}</Text> 
        </Button> 

       }> 
     </FlatList> 
     </Content> 

    ); 
    } 

一つのエラーメッセージは次のとおりです。

警告：flexWrap: wrap``はなくFlatListとnumColumnsを使用してVirtualizedList components.Considerでサポートされていません。私はコンポーネントをラップすることができた方法

Answer 1

が、これは

numColumns={3} 

Answer 2

小道具

flatlist: { 
    flexDirection: 'column', 
}, 

の下、コメントを追加しました私のFlatListコンポーネントで残念ながらflexWrapはFlatListsで実際にサポートされていないようでした。この効果を作成するには、FlatListではなくScrollViewを使用することをお勧めします。これは問題です：https://github.com/facebook/react-native/issues/13939