I have been working on some little side project dubbed Lolfacts, while learning much more of Firebase for Web and need to CRUD(Create, Read, Update and Delete) has been evident in the tiny project. Really exciting.
If this is the first time exploring Firebase Cloud Firestore for Web, be sure to have a look at this codelab code snippets and/or take it just to understand how to render each document data into the Front-end using Vanilla ES6.
1. Within the delete element
// 1. grab the delete element say "del" and listen to a click event
del.addEventListener("click", event => {
// 2. prompt to confirm delete
let result = confirm("Want to delete? This action can not be undone.");
if (result) {
// 3. logic to delete the element named say, "lolfact"
event.stopPropagation();
let id = lolfact.getAttribute("data-id");
console.log(id);
// 4. get the collection to delete from
db.collection("lolfacts")
.doc(id)
.delete();
// 5. delete it from the parent element to refresh the ui
app.removeChild(lolfact);
}
});
Orginally Posted on maye.pwafire.org
Top comments (0)