Question

我正在使用Vue.js启动我的第一个认真的应用程序，但是从Firabase收集数据时遇到了问题。这里的想法只是简单地获取链接到用户ID的数据。我的第一个操作是将其存储在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。

我的猜测是，该值是在异步调用结束之前计算的。但是我看不到如何解决它。

Answer 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();
        }
      });
  }

}

在Vue.js组件中从Firebase获取数据

1 个答案: