My Reducer:
const initialState = {
1: {
id: '1',
name: 'AryaStark',
theimage: "https://upload.wikimedia.org/wikipedia/en/3/39/Arya_Stark-Maisie_Williams.jpg"
},
2: {
id: '2',
name: 'SansaStark',
theimage: "https://upload.wikimedia.org/wikipedia/en/7/74/SophieTurnerasSansaStark.jpg"
}
}
I am able to show rest of the content but not the image. My code:
const renDataNew = Object.keys(this.props.newData).map((key, idx) => {
let data = this.props.newData[key]
return (
<View key={idx} style={styles.myStyle1}>
<Text style={styles.myStyle2}>{data.id} - {data.name}</Text>
<Image
style={{width: '100%', height: 600}}
source={{uri:{data.theimage}}} //<= Error here expecting a ,
/>
</View>
If I use the url in theimage
directly in the uri source of Image
, it works. What am I doing wrong?
What is the proper way to show the image? Many thanks.
I think it should be:
<Image
style={{width: '100%', height: 600}}
source={{ uri: data.theimage }}
/>
You don't need extra {}
around data
object.