Tengo un forEach() que muestra un par de imágenes. Me gustaría que se eliminen si es necesario. Busco el src de la imagen y la ruta/nombre de archivo de la imagen de Firestore para mostrar con la imagen en mi sitio (se cargan en el almacenamiento y en Firestore).

¿Cómo identifico una sola imagen de todas ellas y elimino solo esa?

código js

 const i = query(collection(db, "teamImages")); const unsubscribe = onSnapshot(i, (querySnapshot) => { const teams = document.querySelector('.teamimages'); querySnapshot.forEach((doc) => { const docData = doc.data(); const article = teams.appendChild(document.createElement('article')); article.innerHTML = ` <p class="path"></p> <img class="team-image"> `; article.children[0].textContent = docData.path; article.children[1].src = docData.url; console.log("Current data: ", docData); }); document.getElementById("team-image").addEventListener("click", function deleteImage() { const filename = document.getElementById("path").innerHTML; if (confirm('Are you sure you want to delete this image')) { const imageDeleteRef = ref(storage, filename); // Delete the file deleteObject(imageDeleteRef).then(() => { // File deleted successfully & delete firestorm reference deleteDoc(doc(db, teamImage, filename)); }).catch((error) => { // Uh-oh, an error occurred! }); } else { // Do nothing! console.log('Image not deleted'); }; }); });

Las imágenes están en una sección de artículo (createElement).

Tuve algunos errores indefinidos y nulos cuando intenté ingresar cualquier código de eliminación de Firebase.

Simplemente no estoy seguro de cómo puedo definir el nombre del archivo de imagen para usar como referencia para eliminar el archivo.