Vue.js Firebase .get not returning expected data

Question

So I'm attempting to pull data from a Firebase database.

Rules are currently set to allow read/write. My function is called in the created lifecycle hook and looks as follows:

db.collection("todos")
      .get()
      .then((snapshot) => {
        snapshot.forEach((element) => {
          console.log(snapshot);
          console.log(element);
        });
      });

My firebase config file looks as follows:

//import firebase from "firebase";
const firebase = require("firebase/app");
// eslint-disable-next-line no-unused-vars
import "firebase/firestore";

// firebase config
var config = {
  apiKey: "",
  authDomain: "",
  databaseURL: "",
  projectId: "",
  storageBucket: "",
  messagingSenderId: "",
  appId: "",
  measurementId: "",
};

// Initialize Firebase
// eslint-disable-next-line
const firestore = firebase.initializeApp(config);
const db = firebase.firestore();
export default db;

However instead of returning objects from the database in the format I expect it returns this:

Object { iE: {…}, kc: {…}, _E: {…}, lE: false, dE: false, rE: undefined }

But what I'm expecting is something that looks like this: Screenshot from a tutorial video

Apologies the last code is a screenshot but it's from a video guide I'm following. Where am I going wrong here? Did Firebase recently update and I need to be doing something different?

Frank van Puffelen · Accepted Answer · 2020-05-25 03:45:26Z

1

It looks like the object in your case was minified, while in the tutorial it wasn't. That should matter for the functionality of the object though, as long as you stick to calling methods/properties that are declared on the QuerySnapshot object and the QueryDocumentSnapshot object.

For example, to see the number of query results and the data of each document, you'd do:

db.collection("todos")
  .get()
  .then((snapshot) => {
    console.log(snapshot.size);
    snapshot.forEach((doc) => {
      console.log(doc.data());
    });
  });

answered May 25, 2020 at 3:45

Frank van Puffelen

603k85 gold badges895 silver badges869 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Robin Lange Over a year ago

Awesome, worked perfectly for my scenario! Thank you :)

Collectives™ on Stack Overflow

Vue.js Firebase .get not returning expected data

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related