Обновление пользовательской картинки firebase не отображает новую фотографию до перезагрузки приложения

Question

Я обновляю изображение профиля пользователя и могу видеть изменение изображения в базе данных. Я храню расположение изображения в профиле. Я могу видеть изменения, происходящие при перезагрузке приложения, и могу видеть, как мгновенно меняется изображение в хранилище Firebase.

Вот структура:

Вот функция, которую я использую для изменения изображения:

export const changeUserAvatar = (userId, imageUrl) => {
    firebaseService
      .database()
      .ref('users/' + userId)
      .update({
        profilePicture: imageUrl
      });
  };

И вот как я рендеринг изображения:

<Avatar size="xlarge" rounded source={{ uri: this.props.profilePicture }} onPress={this.openPicker}/> :

Я использую Redux для управления состоянием и думаю, что он будет автоматически перерисован с обновлением значения профиля. Я попробовал все здесь:

https://github.com/facebook/react-native/issues/9195

https://github.com/facebook/react-native/issues/12606

И когда я пытаюсь добавить что-то вроде этого, я вообще не получаю изображение, и оно отображается как пустой экран:

{{uri: profilePicture + '?' + new Date()}}

Я сталкиваюсь с той же проблемой, когда я возвращаюсь к списку своих сообщений / картина меняется только при полной перезагрузке приложения.

Answer 1

Я наконец получил решение этой проблемы:

componentDidUpdate(prevProps) {
    if (this.props.photoUrl && prevProps.photoUrl !== this.props.photoUrl) {
        this.setState({ profilePicture: this.props.photoUrl })
    }
}

По сути, я просто решил сохранить новую картинку как состояние.