ネイティブベースフレックス方向オンコンテンツが動作しない

Question

2つの画像を別の画像の下に並べて表示する必要があります。ここに私のコードです：

<Content style={{flexDirection: 'row', flexWrap: 'wrap'}}> 
    <Image 
     key={data[0]['id']} 
     source={{ uri: data[0]['image']['url']}} 
     style={{ 
      width: Dimensions.get('window').width * 0.2, 
      height: 120, 
      }} 
     /> 
    <Image 
     key={data[1]['id']} 
     source={{ uri: data[1]['image']['url']}} 
     style={{ 
     width: Dimensions.get('window').width * 0.2, 
     height: 120, 
     }} 
    />   
</Content> 

しかし、それは必要なように動作していません。私はここで何が欠けていますか？代わりにコンテンツのビューを使用することによって解決

Answer 1

Avoid flexWrap and use flex. 

<Content style={{flexDirection: 'row', flex:1}}> // Note flex. 
    <Image 
    key={data[0]['id']} 
    source={{ uri: data[0]['image']['url']}} 
    style={{ 
     flex: 0.5, // Give the 50% of the width to this image. 
     height: 120, 
     }} 
    /> 
    <Image 
    key={data[1]['id']} 
    source={{ uri: data[1]['image']['url']}} 
    style={{ 
     flex: 0.5, // Give the 50% of the width to this image. 
     height: 120, 
    }} 
/>   

I haven't really tested this code. But it should work fine. Thanks. 

Answer 2

一時。しかし、ネイティブ・ベース・コンテンツでは問題は残ります。