单击按钮时不从 Firebase 中删除文档（onclick 方法）答案

【问题标题】：Does not delete document from firebase when click on button (onclick method)单击按钮时不从 Firebase 中删除文档（onclick 方法）
【发布时间】：2018-01-26 10:18:28
【问题描述】：

不删除 cloud-firestore 中存储的文档。

当我运行我的程序时显示 5 个按钮（因为我的 Firestore 文档是 5 个），当我单击按钮时显示错误 test.html:1 Uncaught ReferenceError: ds5678fhiksnie is not defined 在 HTMLButtonElement.onclick (test.html:1) 我想单击按钮时，将删除文档中的 id。

<html>
<body>
    <!-- parent named class inner buttons according document stored in cloud-firestore-->
    <div class="parent"></div>
    <-- api -->
    <script src="https://www.gstatic.com/firebasejs/4.9.0/firebase.js"></script>

    <script
        src="https://www.gstatic.com/firebasejs/4.9.0/firebase-firestore.js"></script>


    <script>
// web setup this is sample
        firebase.initializeApp({
         apiKey: '### FIREBASE API KEY ###',
         authDomain: '### FIREBASE AUTH DOMAIN ###',
         projectId: '### CLOUD FIRESTORE PROJECT ID ###'
});
firebase.initializeApp(config);
</script>
    <script>
        var db = firebase.firestore();
        // inserting one record automatic id
        db.collection("users").add({
            first: "Ada",
            last: "Lovelace",
            born: 2000
        })
        .then(function(docRef) {
            console.log("Document written with ID: ", docRef.id);
        })
        .catch(function(error) {
            console.error("Error adding document: ", error);
        });

        // get element
        var p =document.querySelector(".parent");
       // display the document
        db.collection("users").get().then(function(querySnapshot) {
            querySnapshot.forEach(function(doc) {
                var d=String(doc.id);
                console.log(d);
                // if stored documents are 5 then 5 buttons will display 
                p.innerHTML+="<button onclick=delet("+String(d)+")>Hello</button>";
            });
        });

         // delete function(id passing)
        function delet(v) {
        console.log(v);
        db.collection("users").doc(v).delete().then(function() {
            console.log("Document successfully deleted!");
        }).catch(function(error) {
            console.error("Error removing document: ", error);
        });
        }

        </script>
</body>
</html>

【问题讨论】：

标签： javascript firebase google-cloud-firestore

【解决方案1】：

使用 JavaScript 文字

 <html>
    <head>

    </head>
    <body>
       <div class="parent">

    </div>
    <script src="https://www.gstatic.com/firebasejs/4.9.0/firebase.js"></script>
    <script src="https://www.gstatic.com/firebasejs/4.9.0/firebase-firestore.js"></script>
    <script>
      // Initialize Firebase
      var config = {
        apiKey: ####,
        authDomain: ####,
        databaseURL: ####,
        projectId: ###,
        storageBucket: ###,
        messagingSenderId: ###
      };
      firebase.initializeApp(config);


    </script>
    <script>
    var db = firebase.firestore();

    db.collection("users").add({
        first: "Ada",
        last: "Lovelace",
        born: 2000
    })
    .then(function(docRef) {
        console.log("Document written with ID: ", docRef.id);
    })
    .catch(function(error) {
        console.error("Error adding document: ", error);
    });


    var p = document.querySelector(".parent");
    db.collection("users").get().then(function(querySnapshot) {
        querySnapshot.forEach(function(doc) {
            var d=String(doc.id);
            console.log(d);

            p.innerHTML+=`<button onclick="deleti('${d}')">Ok</button>`;
        });
    });
    function deleti(v) {
    v=v.toString();

    console.log(v);
        db.collection("users").doc(v).delete().then(function() {
            console.log("Document successfully deleted!");
        }).catch(function(error) {
            console.error("Error removing document: ", error);
        });

    }

    </script>
    </body>
    </html>

【讨论】：

【解决方案2】：

尝试collection.child(v).remove() 然后处理您的回调。

【讨论】：