How to display an image in react-native from an api and append to baseURL

Viewed 23

I am trying to display an image in react-native from an api and I want to append the fetched value with the base url which is https://lsm-static-prod.livescore.com/medium but image cannot be seen. enter image description here This is the code. Please help

const baseURL = 'https://lsm-static-prod.livescore.com/medium/'

<Image 
   source={baseURL + item.Events[0].T1[0].Img}
             resizeMethod="contain"
             style={{
                     width: 30,
                     height: 30,
                   }}
/>
1 Answers

FOr image in react native :

you should do

source should be extracted like this :

const uri =`${baseURL}${item.Events[0].T1[0].Img}`

And for uri you need to pass as source = {{uri:YOUR_URL}}

<Image 
   source={{uri:uri}}
             resizeMethod="contain"
             style={{
                     width: 30,
                     height: 30,
                   }}
/>

Hope it works :)

Related