如何在原生反应中显示动态图像？

我必须表明我的应用程序的动态图像，该图像的地址{item.p2[0].image}此JSON对象来如下如何在原生反应中显示动态图像？

/media/profiles/qA94ILU.jpg 
/media/profiles/DSCN3253.JPG 
/media/profiles/DSCN2102_iVPC7S1.JPG 
/media/profiles/DSCN3253.JPG 
/media/profiles/DSCN2204.JPG

，我试图为

<Image source={{uri: 'http://10.42.0.1:8000{item.p2[0].image}'}} style={{width: 150, height: 100}} />

，如果显示这些图片我在chrome上直接显示地址或者像这样source={{uri:'http://10.42.0.1:8000/media/profiles/qA94ILU.jpg'}}然后显示正确。那么我应该如何把这个地址从json对象转换为任何变量以及如何显示它呢？

，了解更多信息

试图用这些而不是工作

render() { 
    contents = this.state.qwerty.data.map((item) => { 
     add = item.p2[0].image; 
     //console.log(add); 
     return (
      <View key={item.p1.id} style={styles.box}> 
      <Text> 
       {item.p2[0].image} 
      </Text> 
      <Image source={{uri: 'http://10.42.0.1:8000{item.p2[0].image}'}} style={{ width: 150, height: 100}}/> 

      <Image source={{uri: 'http://10.42.0.1:8000{add}'}}style={{ width: 150, height: 100}}/> 
      </View> 
     ); 
    });

来源

2017-09-11 mayuresh patil

是要显示所有图像？ –

@MaulanaPrambadi是的..想要显示所有图像 –

您正在使用错误的语法为字符串相结合。查询Template Literals了解更多信息。

更改此

<Image source={{uri: 'http://10.42.0.1:8000{item.p2[0].image}'}} style={{ width: 150, height: 100}}/>

这个

<Image source={{uri: `http://10.42.0.1:8000${item.p2[0].image}`}} style={{ width: 150, height: 100}}/>

或

<Image source={{uri: 'http://10.42.0.1:8000' + item.p2[0].image}} style={{ width: 150, height: 100}}/>

来源

2017-09-11 15:39:27 bennygenel

yaa非常感谢它很工作... –

如何在原生反应中显示动态图像？

回答

相关问题