How to get data from firestore DB in outside of onSnapshot

Result undefined when I try to get value from firestore and put to a variable, but works in console.

My code:

this.db.collection('Users').doc(uid).get()
  .then((docSnapshot) => {
    if (docSnapshot.exists) {
      this.db.collection('Users').doc(uid)
        .onSnapshot((doc) => {
          console.log(doc.data()); //working
          perfil = doc.data(); //not working
        });
    }
  });

console.log(perfil); //not working. Display undefined

Answers:

Answer

The data is loaded from Cloud Firestore asynchronously. Because this may take some time, the code after the callback immediately continues. Then when the data is available, Firestore calls your onSnapshot callback.

It's easiest to see what's happening by adding a few log statements:

console.log('Before adding listener');
this.db.collection('Users').doc(uid).get()
.then((docSnapshot) =>{
  console.log('Got data');
});
console.log('After adding listener');

When you run this code, it prints:

Before adding listener

After adding listener

Got data

This is probably not the order you expected. But it explains perfectly why your console.log(perfil) prints undefined: the data hasn't been loaded yet!

Because of this, all code that needs access to the data needs to be inside the onSnapshot callback. For example:

this.db.collection('Users').doc(uid).get()
.then((docSnapshot) =>{
  if (docSnapshot.exists) {
    this.db.collection('Users').doc(uid)
    .onSnapshot((doc) => {
        console.log(doc.data());
        perfil = doc.data();
        console.log(perfil);
    });
  }
});

For more on this, see:

Tags

Recent Questions

Top Questions

Home Tags Terms of Service Privacy Policy DMCA Contact Us

©2020 All rights reserved.