React-native can't display images from database - react-native

Question

I can't display images in my react-native application. I have a simple database connected with php for my application where I added the images path, they are stored locally. All I am trying to do is to retrieve the strings for the location. If I write the path manually it works.
Here is the code for the component
export default class Accordian extends Component{
constructor(props) {
super(props);
this.state = {
data: props,
expanded : false,
updated_Height: 0,
}
if (Platform.OS === 'android') {
UIManager.setLayoutAnimationEnabledExperimental(true);
}
}
componentWillReceiveProps(update_Props) {
if (update_Props.item.expanded) {
this.setState(() => {
return {
updated_Height: null
}
});
}
else {
this.setState(() => {
return {
updated_Height: 0
}
});
}
}
shouldComponentUpdate(update_Props, nextState) {
if (update_Props.item.expanded !== this.props.item.expanded) {
return true;
}
return false;
}
render() {
return (
<View style={styles.Panel_Holder}>
<TouchableOpacity activeOpacity={0.7} onPress={this.props.onClickFunction} style={styles.Btn}>
<Text style={styles.Panel_Button_Text}>{this.props.item.make} {this.props.item.model}</Text>
<Text style={styles.Panel_Button_Text}>{this.props.item.price}$/day</Text>
</TouchableOpacity>
<View style={{ height: this.state.updated_Height, overflow: 'hidden' }}>
<View style={{width:400,flexDirection:"row", alignItems:"center", justifyContent:"space-evenly"}}>
<View style={{width:110,}}>
<Text style={{bottom:50, fontSize:25, fontWeight:"bold"}}>
{this.props.item.name}
</Text>
<Text>
<Image source={require('../images/person-silhouette.png')} />
{this.props.item.nr_seats}
</Text>
<Text>
<Image source={require('../images/shopping-bag.png')} />
{this.props.item.bag_capacity}
</Text>
<Text>
<Image source={require('../images/gas-station.png')} />
{this.props.item.gas_desc}
</Text>
{console.log( this.props.item.cars_img)}
</View>
<View style={{width:220,height:300,alignItems:"center",justifyContent:"center",}}>
<Image style={{ flex: 1, width: '100%', height: '1000%',resizeMode: 'contain',}} source={this.props.item.cars_img}/>
</View>
</View>
</View>
</View>
)
}
}

Answer 1

Try changing it to source={{uri: this.props.item.cars_img}}