2016-08-16 13 views
0

私は反応ネイティブを使っている単純なアプリケーションでローカルイメージを読み込もうとしています。私はここのガイドを次てる反応的なネイティブリストビューで動的ローカルイメージを追加する

からhttps://facebook.github.io/react-native/docs/images.html

残念ながら、そのガイドでは、次の言葉:仕事に、このためには、必要でイメージ名を静的に知らなければならないこと

注意。

renderRow(chat){ 
    return (
     <View style={ styles.row }> 
     <Image 
      source={require(`../images/${chat.image}`)} //this is the part that's not working. It can't require a dynamic path 
      style={ styles.cellImage } 
      /> 
     </View> 
); 
} 

どのように私はこれを達成することができます:私は、リストビュー内の行をレンダリングしようとすると、自分のコードが機能しない理由である

?または、別の方法で作業することを提案できますか?

答えて

0

奇妙で奇妙ですが、画像にオプションが設定されている場合(イメージがプロジェクトに存在する場合は意味があります)、指定された条件に基づいて静的に必要な画像を返すことができます。

getSource() { 
    if (condition) { 
     return require('../images/option-one'); 
    } else { 
     return require('../images/default-option'); 
    } 
} 

renderRow(chat){ 
    return (
     <View style={ styles.row }> 
      <Image 
       source={ this.getSource() } 
       style={ styles.cellImage } 
      /> 
     </View> 
    ); 
} 
+0

これはちょっと風変わりですが、これは完璧に動作します。ありがとうございます。 – Finnnn

関連する問題