React Native 无法从集合firebase firestore获取所有文档

af7jpaap  于 2023-01-14  发布在  React
关注(0)|答案(2)|浏览(150)

我不明白为什么我不能从firebase firestore数据库中获取数据。
我的错误:
[Firebase错误:collection()的第一个参数应为CollectionReference、DocumentReference或FirebaseFirestore]
我的firebase配置文件设置正确,我可以添加数据与此模型:

{ item: { ...event, date } }

我的文件结构:picture of my structure
我已经正确地声明了我的状态,我用try catch异步等待。
我使用了firebase文档中的此选项
EventList.js

import { FlatList, View, Text, StyleSheet } from "react-native";
import React, { useState, useEffect } from "react";
import { EVENTS_COLLECTION } from "../commons/constants";
import db from "../commons/services/firebase";

const EventList = () => {
  const [events, setEvents] = useState([]);

  useEffect(() => {
    const fetchEvents = async () => {
      try {
        const querySnapshot = await getDocs(collection(db, EVENTS_COLLECTION));
        querySnapshot.forEach((doc) => {
          console.log(doc.id, " => ", doc.data());
        });
        setEvents(
          querySnapshot.forEach((doc) => {
            doc.id, " => ", doc.data();
          })
        );
      } catch (error) {
        console.error(error);
      }
    };
    fetchEvents();
  }, [setEvents]);

  return (
    <View>
      <FlatList
        data={events}
        keyExtractor={(item) => item.id}
        renderItem={({ item }) => (
          <View style={styles.eventContainer}>
            <Text style={styles.eventName}>{item.name}</Text>
            <Text style={styles.eventDate}>{item.date.toString()}</Text>
          </View>
        )}
      />
    </View>
  );
};

firebase.Js

const firebaseConfig = {
  apiKey: "",
  authDomain: "",
  databaseURL:
    "https://calendar-f3025-default-rtdb.europe-west1.firebasedatabase.app",
  projectId: "calendar-f3025",
  storageBucket: "calendar-f3025.appspot.com",
  messagingSenderId: "",
  appId: "",
  measurementId: "",
};

const app = initializeApp(firebaseConfig);
export const db = getFirestore(app);

我试图从我的事件收集所有的文档。我的目标是使一个日历与事件管理器与firebase的firestore数据库

s8vozzvw

s8vozzvw1#

在firebase.js中,您可以这样导出数据库:

export const db = getFirestore(app);

这是一个命名导出,因此您需要一个命名导入:

import { db } from '../commons/services/firebase'
// or
// import * as config from '../commons/services/firebase'
// const db = config.db

导入的方式是默认的导出,结果是undefined,因此firebase抱怨collection的第一个参数不正确(未定义)。
您可以阅读更多关于导入here的信息。

ig9co6j1

ig9co6j12#

如果EVENTS_COLLECTION正确返回集合的名称,那么您将获得所有文档,否则使用"Collection Name",其中您写入了EVENTS_COLLECTION。

const fetchEvents= async () => { 
     await db.collection(EVENTS_COLLECTION).onSnapshot({
          error: e => console.error(e),
          next: (querySnapshot) => {
               var data = [];
               var i = 0;
               querySnapshot.forEach(doc => {
                    data.push(doc.data());
                    console.log(doc.id, " => ", doc.data());
               });
               setEvents(data)
          },
     })   
};

相关问题