2

im working with Yelp Api and i tried to search for Restaurants but im having a problem with the Restaurant image im getting the name and rating with no problem but for the image its showing for the first time but when i reload my app it give this error : Value of uri cannot be cast from double to string

here's the code :

const RestaurantItems=(props)=>{
    return(
        
        <ScrollView>
    <View style={props.theme=='light'?styles.container:styles.darkContainer}>
        
        {props.restaurantsData.map((item,index)=>(
        
            <View style={{marginTop:20}} key={index}>
                 <View style={styles.Img}>
              <Image source={{uri:item.image_url}}style={{width:'100%',height:180}} />
              

        </View>
        <View style={{paddingLeft:10,marginTop:15,flexDirection:"row",justifyContent:'space-between',alignItems:"center"}}>
            <View>
              <Text style={[{fontSize:19,fontWeight:"700"},props.theme=='dark'?{color:'white'}:{color:'black'}]}>{item.name}</Text>
              <Text style={{color:'#717171'}}>35-45 m</Text>
              </View>
              <View style={{marginRight:10,backgroundColor:"#eee",paddingHorizontal:7,borderRadius:30}}>
                  <Text style={{fontSize:19,fontWeight:"500"}}>{item.rating}</Text>
              </View>
        </View>
            </View>
        ))}
        </View>
        </ScrollView>
       

       
    )}```
Zaki Kendil
  • 237
  • 2
  • 9

1 Answers1

2

item.image should be url string check the value of props.restaurantsData may be one of the index has image_url as number OR try replacing item.image with item.image_url.toString()

Dheeraj
  • 240
  • 2
  • 8
  • props.restaurantsData is pulled from yelp API how can i see my api result so i can check ? i tried console.log but its not working ! i dont understand why in the first time it works but if i refresh it gives me the error – Zaki Kendil Nov 29 '21 at 14:45
  • may be props are getting updating after first render. To view data you can do console.log(props.restaurantsData) above return OR to view on screen `{JSON.stringify(props.restaurantsData)}` – Dheeraj Nov 29 '21 at 15:00
  • console log worked now and i can see , i tried the toString() function and it worked now its showing the images even after i reload ! THANK you so much you saved a lot of time , if that doesnt bother you i wanna ask you another question , when i console logged the data , the image_url was already a string how is that logic that i have to make it string again to work ? – Zaki Kendil Nov 29 '21 at 15:14