Updating Data in Firebase using React

Question

I am updating an object in firebase using React js. I'm using this boilerplate as reference.

  updateBookList: (id, data) => {
    return firebaseDb.ref('NewBooks').child(id).update(data).then(() => {
      return {};
    }).catch(error => {
      return {
        errorCode: error.code,
        errorMessage: error.message
      }
    });
  },

The following updates the Books fine.

What I want to do is return the result instead of returning a blank {}. How can I return the result of what I updated?

This is how I fetch books:

  fetchBooks: () => {
    return new Promise((resolve, reject) => {
      const bookSub = firebaseDb.ref('NewBooks').on("value", books => {
        resolve(books.val());
      }, error => {
        reject(error);
      })
    })
  },

Answer 1

If you want to return the value, you need to retrieve it. You can do that using once and the value event, which returns a promise that resolves to a Firebase snapshot:

updateBookList: (id, data) => {
  let ref = firebaseDb.ref('NewBooks');
  return ref
    .child(id)
    .update(data)
    .then(() => ref.once('value'))
    .then(snapshot => snapshot.val())
    .catch(error => ({
      errorCode: error.code,
      errorMessage: error.message
    }));
}

Also, you could simplify your fetchBooks by using once there, too:

fetchBooks: () => {
  return firebaseDb.ref('NewBooks')
    .once("value")
    .then(snapshot => snapshot.val());
}

once returns a promise, so you don't have to create your own and you won't have a dangling event listener. The call to on in your implementation of fetchBooks will see a listener added with each call and multiple calls to resolve will be attempted if the database changes.