イメージをバインドするフラットリストに反応するネイティブ

Question

私はフラットリストにイメージURIをバインドしようとしています。しかし、そうではありません。レンダリング..

this.state = { 
     data: [ 

      { 
       avatar: 'require(../../resources/icons/MyAccount/rounduser.png)', text: 'Bank Accounts', val: '' 
      }, 
      { 
       avatar: 'require(../../resources/icons/MyAccount/rounduser.png)', text: 'PrePaid-Cards', val: '' 
      }, 
      { 
       avatar: 'require(../../resources/icons/MyAccount/rounduser.png)', text: 'Other Wallets', val: '' 
      }, 
      { 
       avatar: 'require(../../resources/icons/MyAccount/rounduser.png)', text: 'Help', val: '' 
      }, 
      { 
       avatar: 'require(../../resources/icons/MyAccount/rounduser.png)', text: 'About App', val: '' 
      } 
     ] 
    } 
} 

私はこのメソッドを使用しています。レンダーアイテムをフラットリストにレンダリングする

_renderList = ({ item }) => { 
    return (
     <View style={styles.listContainer} > 
      <Image style={styles.listImage} source={item.avatar} /> 
      <Text style={styles.listText} >{item.text}</Text> 
      <Text style={styles.listVal} >{item.val}</Text> 
      <Image style={styles.listImage} source={require('../../resources/icons/MyAccount/arrowright.png')} /> 
     </View> 
    ); 

} 

レンダリングの空き領域です。私は行方不明のものがありますか？

Answer 1

文字列内にrequireがあります。平らなものでなければなりません：

avatar: require('../../resources/icons/MyAccount/rounduser.png')