How to delete object from array in firestore

Posted on

How to delete object from array in firestore – Even if we have a good project plan and a logical concept, we will spend the majority of our time correcting errors abaout and javascript. Furthermore, our application can run without obvious errors with JavaScript, we must use various ways to ensure that everything is operating properly. In general, there are two types of errors that you’ll encounter while doing something wrong in code: Syntax Errors and Logic Errors. To make bug fixing easier, every JavaScript error is captured with a full stack trace and the specific line of source code marked. To assist you in resolving the JavaScript error, look at the discuss below to fix problem about How to delete object from array in firestore.

Problem :

I have a problem with deleting an Object out of an Array in firestore.
I have this data in firestore:

enter image description here
enter image description here

And now I would like to delete e.g the second Object out of the posts Array.

Code:

 deletePic () {
  let docId = `${this.currentUser.uid}`

   fb.usersCollection.doc(docId).update({
     posts: firebase.firestore.FieldValue.arrayRemove()
   })
  .catch(function(error) {
      console.error("Error removing document: ", error);
  });
}

But I do not know how to define arrayRemove()

These are the pictures and each one has a delete button to delete the picture.

enter image description here

Solution :

You could also use the arrayRemove method from the FieldValue helper.

docRef.update({
   array: FieldValue.arrayRemove('idToRemove');
});

https://firebase.googleblog.com/2018/08/better-arrays-in-cloud-firestore.html

EDIT: Warning Do not use my solution as it is more than 3 years old, nowadays there is new solution : https://stackoverflow.com/a/59745086/6668441 Mine was a pure js one and is a bad pattern.

Can’t you use filter ? And then return the new posts array to your fb.usersCollection method

//deleteId is the id from the post you want to delete
posts.filter(post => post.id !== deleteId);

edit : So This should be something like :

 deletePic (deleteId) {
  let docId = `${this.currentUser.uid}`

   //deleteId is the id from the post you want to delete

   fb.usersCollection.doc(docId).update({
     posts: posts.filter(post => post.id !== deleteId);
   })
  .catch(function(error) {
      console.error("Error removing document: ", error);
  });
}

You can preform delete of an object in the array by using arrayRemove function.
But, you’ll need to provide an object.
That object needs to be identical to the one in your doc array on the firestore collection.

For example:

The following code will delete obj from myArray array,
but only if obj exactly exist in that array.

const obj = { field1, field2 ... } 

collectionRef.doc(docId).update({
    myArray: firebase.firestore.FieldValue.arrayRemove(obj)
})

Update elements in an array

If your document contains an array field, you can use arrayUnion() and
arrayRemove() to add and remove elements. arrayUnion() adds elements
to an array but only elements not already present. arrayRemove()
removes all instances of each given element.

// Atomically remove a region from the 'regions' array field.
city_ref.update({u'regions': firestore.ArrayRemove([u'east_coast'])})

If you’re using Firebase V9 (modular), you can simply import arrayRemove from Firestore like so:

import { doc, updateDoc, arrayRemove } from 'firebase/firestore';

const docRef = doc(db, 'collection', 'doc');
await updateDoc(docRef, {
  arrayName: arrayRemove('elementName');
}); 

Leave a Reply

Your email address will not be published. Required fields are marked *