How to turn Firestore query into a Javascript array

Question

I am trying to export a firestore function that performs a query and returns an array containing the objects in that query. I am trying to get data from a subcollection of a document, and get an array of document objects returned to render to the client.

I've tried the below but it's not working (e.g. the object returns blank). I think this has to do with improper handling of promises, but couldn't figure it out on my own. Thanks for your help.

export const getEvents = (id) => {
  let events = [];
  firestore.collection('users')
    .doc(id)
    .collection('events')
    .get()
    .then((snapshot) => {
      snapshot.forEach((doc) => events.push(doc));
    });
    return events;
 };

Ricardo Smania · Accepted Answer · 2018-09-27 12:15:07Z

3

You are correct in identifying this problem is related to the handling of promises. You are returning the events array before it has a chance to be populated, because the promise hasn't resolved yet.

If your environment allows it, I would recommend that you use async/await, because it makes the code much easier to read and understand, like this:

export const getEvents = async (id) => {
    let events = [];
    const snapshot = await firestore.collection('users')
        .doc(id)
        .collection('events')
        .get()
    snapshot.forEach((doc) => events.push(doc));
    return events;
};

But if you can't use async/await you can do it with promises. But you need to only resolve the promise after the data is fetched:

const getEvents = (id) => {
    return new Promise((resolve, reject) => {
        let events = [];
        const snapshot = firestore.collection('users')
            .doc(id)
            .collection('events')
            .get()
            .then((snapshot) => {
                snapshot.forEach((doc) => events.push(doc));
                resolve(events); // return the events only after they are fetched
            })
            .catch(error => {
                reject(error);
            });
    });
};

answered Sep 27, 2018 at 12:15

Ricardo Smania

3,1692 gold badges28 silver badges36 bronze badges

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

1 Comment

Maneesh Karna Over a year ago

Thank you - I'll try this out and follow up if I run into any more problems.

Collectives™ on Stack Overflow

How to turn Firestore query into a Javascript array

1 Answer 1

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related