React Native image disappears when URI changed using useState

Question

Using React Hooks to store the image URL to the state, with a default image at the beginning. The picture was displayed properly.

const [companyPhoto, setCompanyPhoto] = useState('https://example.com/no-image.jpg');

After calling an API to upload image from React Native, I tried updating the state with a new URL and companyPhoto was updated properly based on console.log. However, the image disappears after companyPhoto is assigned with a new URL.

setCompanyPhoto(data.company.image.url);

Following is the code used to display the image. Tried adding a key, setting cache and header but still the same.

<Image
  style={styles.uploadPhoto} 
  key={Date.now()}
  source={{ 
    uri: `${companyPhoto}`, 
    cache: 'reload',
    headers: {
      Pragma: 'no-cache'
    },
  }} 
/>

question from:https://stackoverflow.com/questions/65938680/react-native-image-disappears-when-uri-changed-using-usestate

Answer 1

Waitting for answers