I am currently using Vue and Firestore in my project.
Below is the code snippet I used to generate a document in the collection:
<template>
<input type="text" v-model="form.title">
</template>
methods: {
async saveForm () {
await db.collection('forms').add(
{
title: this.title
}
)
}
}
And here is the code I used to read the documents:
<div v-for="(form, i) in forms" :key="form.id">
{{form.title}}
<button @click="readId">Read ID</button>
<button @click="deleteForm">Delete</button>
</div>
async created () {
const snapshot = await db.collection('forms').get()
snapshot.forEach(doc => {
const { title } = doc.data()
this.forms.push({
title
})
})
https://i.sstatic.net/MNMEz.png
I need help getting the ID of the form clicked when the 'Read ID' button is clicked.
This information is necessary for deleting a particular form with
db.collection('forms').doc().delete()Please let me know if further clarification is needed. I am open to edits and suggestions.
-edited- I apologize for the confusion in my previous explanation. I not only need the ID but also want to create a deletion functionality upon clicking the delete button associated with each form.
I will rephrase my question and repost it for better clarity.