Returning array of results from Firebase query

Question

I'm using the @react-native-firebase wrapper to interact with Firebase's Firestore. I have a function which performs some querying to one of my collections and the intended response should be an Array object containing each found document.

My function currently looks like:

export const backendCall = async => {
  let response = [] 
  firestore()
  .collection('collection')
  .where('id', '==', 1)
  .onSnapshot(documentSnapshot => {
    documentSnapshot.forEach(x => response.push(x.data())) 
  })
  return response

On my UI, I use a react-native Button component which calls this function onPress:

<Button 
  title="get" 
  onPress={() => {
    backendCall().then(response => console.log(response)) 
  }}
/>

Using console.log I am able to observe the expected Array object (but with a "value below was evaluated just now" icon. If however, I change the onPress to console.log(JSON.stringify(response)), the Array object is empty.

I'm assuming this has something to do with the async calls but I can't quite figure out how to fix it. Would appreciate some pointers.

Duc Nguyen · Accepted Answer · 2020-07-14 01:24:23Z

1

You're returning the response without waiting for the result from your firebase query. To wait for the response to arrive before returning, you can use Promise.

export const backendCall = () => {
    return new Promise(resolve => {
        firestore()
            .collection('collection')
            .where('id', '==', 1)
            .onSnapshot(documentSnapshot => {
                const response = []
                documentSnapshot.forEach(x => response.push(x.data()))
                resolve(response)
            })
    })
}

You can use Array.map to make the for loop looks nicer.

const response = documentSnapshot.map(x => x.data())
resolve(response)

answered Jul 14, 2020 at 1:24

Duc Nguyen

8536 silver badges12 bronze badges

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

1 Comment

barte Over a year ago

That's very helpful. Thank you.

Andrew Smith · Accepted Answer · 2021-10-27 20:50:30Z

1

You can also read docs from a QuerySnapshot:

export const backendCall = async () => {
  const qs = firestore().collection('collection').where('id', '==', 1).get()
  return qs.docs.map(x => x.data())
}

answered Oct 27, 2021 at 20:50

Andrew Smith

1,4651 gold badge13 silver badges30 bronze badges

Collectives™ on Stack Overflow

Returning array of results from Firebase query

2 Answers 2

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related