Firebase 功能重新加载 auth currentUser，不会在 vue 组件中刷新

Question

我正在使用 reload 函数更新配置文件 url，我有一个计算属性，但这不反映更改

计算属性

computed: {
    photoUrl: function() {
      return firebase.auth().currentUser.photoURL;
    },
  }

功能

onFileChanged: async function(e) {
      this.image = e.target.files[0];
      if (this.image) {
        try {
          this.loading = true;
          const url = await saveImage(this.image, this.uploadProgress);
          await auth.currentUser.updateProfile({
            photoURL: url
          });
          await auth.currentUser.reload();
        } catch (error) {
          this.setTexto("Ocurrió un error al actualizar tu foto de perfil.");
          this.setColor("error");
          this.setVisible(true);
          console.error(error);
        } finally {
          this.progreso = 0;
          this.loading = false;
        }
      }
    }

我承诺使用 Firebase 云存储上传文件。

Answer 1

另一种方法是在 data 对象中添加一个简单属性并在您的函数中对其进行更新，如下所示：

data: {
  //....
  photoUrl: null,
  //....
}

//...
onFileChanged: async function(e) {
      this.image = e.target.files[0];
      if (this.image) {
        try {
          this.loading = true;
          const url = await saveImage(this.image, this.uploadProgress);
          this.photoUrl = url;  // <-------
          await auth.currentUser.updateProfile({
            photoURL: url
          });
          await auth.currentUser.reload();
        } catch (error) {
          //...
        } finally {
          //...
        }
      }
    }