在重新加载应用程序之前更新 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 })
    }
}

基本上，我只是决定将新图片存储为状态。

在重新加载应用程序之前更新 firebase 用户图片不呈现新照片

Updating firebase user picture not rendering new photo until reloading app

rendering

firebase

react-native

react-props

react-native-elements