Image before state URI change:
Image after state URI change:
Every time you change the Image component source {} prop, there is no change in the image displaying. I am also going to note that the changed uri is in fact ‘different’ from the previous. I have boiled this down to a cache problem on the emulator. I'm looking for the image to render again on state change, or use a completely different Image module as the one from react native seems to be useless.
import { Image } from "react-native";
async componentDidMount(){
await this.getUserInformation();
}
async getUserInformation(){
let tempObject = {}
try {
await AsyncStorage.getItem("@UserValues").then((userObject) => { tempObject = JSON.parse(userObject); })
this.setState({image: tempObject.image})
} catch(e) { this.refs.toast.show("We are having issues saving your information..."); }
}
async createFile(result){
.......
fetch(......., requestOptions)
....
.then(async(res) => {
this.setState({image : imageURI})
let tempObject = { image: imageURI }
await AsyncStorage.mergeItem('@UserValues', JSON.stringify(tempObject));
})
.catch(error => console.log('error', error));
}
render() {
return (
<View>
<TouchableOpacity
onPress={this._pickImage}>
<Image
source={{ uri:this.state.image }}
style={styles.editProfilePicImage}>
</Image>
</TouchableOpacity>
</View>

