CODEWITHSUNDEEP
javascriptfirebasereact-nativegoogle-cloud-firestore
Camille
Camille

Reputation: 25

Can't get all document from collection firebase firestore

I don't understand why I can't get data from firebase firestore database.

my error :

[FirebaseError: Expected first argument to collection() to be a CollectionReference, a DocumentReference or FirebaseFirestore]

My config file with firebase config is correctly set, I can add Data with this model :

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

My files structures : picture of my structure

I have correctly declared my state, I have async await with try catch.

I have used this from firebase documentation

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([]);



  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:
    "",
  projectId: "",
  storageBucket: "",
  messagingSenderId: "",
  appId: "",
  measurementId: "",
};

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

I try to get all documents from my events collection. My goal is to make an Calendar with event manager with firebase firestore database

Upvotes: 1

Views: 593

Answers (2)

Abdul Saboor
Abdul Saboor

Reputation: 19

Try this one if EVENTS_COLLECTION returns the name of the collection correctly then you will get all documents otherwise use "Collection Name" where you write 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)
          },
     })   
};

Upvotes: 0

A_A
A_A

Reputation: 1932

In firebase.js you export db like this:

export const db = getFirestore(app);

This is a named export, therefore you will need a named import:

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

The way you import is for default exports and results in your case with undefined. Therefore firebase complains that the first argument to collection is not correct (it's undefined).

You can read more about imports here.

Upvotes: 1

Related Questions