Получить данные из Firebase в компоненте Vue.js

Я запускаю свое первое серьезное приложение с Vue.js, и у меня возникла проблема со сбором данных из Firabase. Идея здесь состоит в том, чтобы просто связать данные с идентификатором пользователя. Моим первым делом было сохранить это в значении computed, вот так

export default {

  ...

  computed: {
    userInfo: function() {
      const firestore = firebase.firestore();
      const docPath = firestore.doc('/users/' + firebase.auth().currentUser.uid);

      docPath.get().then((doc) => {
        if (doc && doc.exists) {
          return doc.data();
        }
      });
    }
  }
}

Но когда я пытаюсь получить доступ к этой переменной, это undifined.

Я предполагаю, что значение вычисляется до завершения асинхронного вызова. Но я не вижу, как это обойти.

Интеграция Angular - Firebase Analytics
Интеграция Angular - Firebase Analytics
Узнайте, как настроить Firebase Analytics и отслеживать поведение пользователей в вашем приложении Angular.
1
0
430
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Действительно, вы должны учитывать асинхронный характер метода get(). Один из классических способов — запросить базу данных в хуке created следующим образом:

export default {

  data() {
    return {
      userInfo: null,
    };
  },

  ....

  created() {
      const firestore = firebase.firestore();
      const docPath = firestore.doc('/users/' + firebase.auth().currentUser.uid);

      docPath.get().then((doc) => {
        if (doc && doc.exists) {
          this.userInfo = doc.data();
        }
      });
  }

}

Другие вопросы по теме