Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to read a sub-collection's document fields from Firestore in react-native

Trying to read all sub collections from a document inside a root-level collection from firebase's Firestore in a react-native project. Not too sure which documentation to follow (web-can't do getCollections() /node?). Firebase is imported and I have successfully retrieved other data from firestore, but never have I been able to read sub collection data. This is not using the library react-native-firebase (Although I’ve tried with react-native-firebase and it has no documented solution to this either) Regardless, I've tried:

componentDidMount() {
    firebase
      .firestore()
      .collection('users')
      .doc(this.props.user.uid)
      .getCollections('conversations')
      .then(collections => {
        collections.forEach(collection => {
          alert(collection.id)
        })
      }) 
}

the above returns '_firebase.default.firestore().collection("users").doc(this.props.user.uid).getCollections' is undefined

also have tried:

componentDidMount() {
    firebase
      .firestore()
      .collection("users")
      .doc(this.props.user.uid)
      .collection("conversations")
      .get()
      .then(collections => {
        collections.forEach(collection => {
          alert(JSON.stringify(collection)); //collection.id is can be read here
        });
      });

in the above, the collection id can be read, but how can the document fields be read? the above gives me cyclic structure errors.

alert(collection.data()) gives me [object Object]

alert(JSON.stringify(collection.data()) gives me cyclic structure errors

here is the firestore:

enter image description here

enter image description here

The practical application would be populating all conversations for a given user, and then all messages for a given conversation. How Do I read data from all sub collections from Firestore in a react-native project?

like image 877
Jim Avatar asked Dec 02 '25 00:12

Jim


2 Answers

To read the sub-collection document data what ultimately worked was:

_getConversation() {
    firebase
      .firestore()
      .collection("users")
      .doc(this.props.user.uid)
      .collection("conversations")
      .get()
      .then(querySnapshot => {
        querySnapshot.forEach(queryDocumentSnapshot => {
          alert(queryDocumentSnapshot.get("members"));
        });
      })
      .catch(err => {
        alert(err);
      });
  }

and

_getMessages() {
    firebase
      .firestore()
      .collection("users")
      .doc(this.props.user.uid)
      .collection("conversations")
      .doc("some-document-id-here")
      .collection("messages")
      .get()
      .then(querySnapshot => {
        querySnapshot.forEach(queryDocumentSnapshot => {
          alert(queryDocumentSnapshot.get("content"));
        });
      });
  }

a deeper dive into documentation was indeed more helpful

like image 190
Jim Avatar answered Dec 04 '25 19:12

Jim


Hi try with below

async _getUserDataFromFirestore() {
        try {
          const ref = firebase
            .firestore()
            .collection('user')
            .doc(this.props.user.uid);
          await ref.get().then(userData => {
           console.log('User details of userID - ' + this.props.user.uid , userData.data());
          });  
        } catch (err) {
          console.log('Error while getting user data from firestore : ', err);
        }
      }

Add call this function in componentDidMount

like image 33
EL173 Avatar answered Dec 04 '25 20:12

EL173



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!