CODEWITHSUNDEEP
javascriptreactjsreact-native
j.doe
j.doe

Reputation: 4859

Conditional check inside Image element

I am new with react-native and I know that it's possible to add an image in different ways.

For local images: 

<Image source={require('/react-native/img/favicon.png')} />

And for remote images:

<Image
    style={{width: 50, height: 50}}
    source={{uri: 'https://facebook.github.io/react-native/docs/assets/favicon.png'}}
/>

I want to check if a link is provided. If yes, I want to display the image and if not, I want to display a local one. My code looks like this:

var image = null
if (item && itame.image){
    image = item.image
}

const defaultImage = '/react-native/img/favicon.png'

return (
    <Image source={{ uri: image}} />
);

How can I in source check if the image is null or not and display the appropriate image?

Upvotes: 3

Views: 1094

Answers (1)

sme
sme

Reputation: 4153

I posted the answer in the comments, so I will move it here for anyone else who is interested:

<Image source={(image === null) ? defaultImage : { uri: image }} />

Upvotes: 3

Related Questions