Question

我正在尝试关注this tutorial。

在尝试重新配置firebase.js配置之前，我已经进行了此工作，以便可以在应用程序中包括身份验证。

我正在尝试从我的应用程序中的集合中读取内容，并显示以下内容：

useEffect(() => {
    let options = [];
    // console.log(Firebase.db.collection("abs_for_codes"));
    // Firebase.db.return
    console.log(Firebase.db);
    Firebase.db
      .collection("abs_for_codes")
      .get()
      .then(
        function(querySnapshot) {
          querySnapshot.forEach(function(doc) {
            options.push({
              value: doc.data().title.replace(/( )/g, ""),
              label: doc.data().title + " - ABS " + doc.id
            });
          });

这一切都起作用，直到我重新定义了Firebase配置。

以前，该配置文件定义了一个Firebase常量，如下所示：

import * as firebase from "firebase";
import firestore from "firebase/firestore";
import app from 'firebase/app';

const Firebase = app.initializeApp(config);

export default Firebase;

现在，我有：

import firebase from 'firebase/app';
import 'firebase/auth';
import 'firebase/firestore';

class Firebase {
  constructor() {
    firebase.initializeApp(config).firestore();
    this.auth = firebase.auth();
    // this.db = app.database();

    // this.db = app.firebase.database()
    this.db = firebase.firestore();

  }  
}
export default Firebase;

当我尝试使用它时，我可以在应用程序中登录Firebase，该应用程序会产生以下输出：

class Firebase {
  constructor() {
    firebase.initializeApp(config).firestore();
    this.auth = firebase.auth();
    // this.db = app.database();

    // this.db = app.firebase.database()
    this.db = firebase.firestore();

  }

我希望能够登录Firebase.db以返回Firestore，但它会产生未定义的内容。

然后，当我尝试访问Firestore中的集合时，出现错误消息：

TypeError：无法读取未定义的属性“ collection”

我见过this post，这暗示着找不到数据库是一个问题-而不是收集问题。

旧的定义数据库方法和新的方法之间的唯一区别是，它位于类方法而不是const中。

如果在一个类中设置了Firebase配置，是否还需要一些额外的东西？

Answer 1

您需要创建Firebase class的实例以访问其属性。

更改

Firebase.db
   .collection("abs_for_codes")
   .get()
   .then(querySnapshot => {
     // do something here
   });

到

const firebase = new Firebase();
firebase.db
   .collection("abs_for_codes")
   .get()
   .then(querySnapshot => {
     // do something here
   });

Firebase：从React中的Firestore读取数据

1 个答案: