使用JavaScript从firebase中移除对象 [英] Remove object from firebase using JavaScript

问题描述

我在firebase-database上设置了一些对象，并在child_added的HTML表格上显示它们，并在append（）添加到数据库后动态添加它们，并且必须有一个删除按钮在表的每一行，但问题是，我不能得到这个删除按钮来工作...
$ b $这是如何的数据库结构如下：

/ p>

 资产：{
 -KkBgUmX6BEeVyrudlfK：{
 id：'-KkBgUmX6BEeVyrudlfK'，
 name ：'John'，
品牌：'HP'
} 
 -KkDYxfwka8YM6uFOWpH：{
 id：'-KkDYxfwka8YM6uFOWpH'，
名称：'Jack'，
品牌：'Dell'
} 
} 
  

这是我的 index.js ：

  var rootRef = firebase.database（）。 。REF（）子（ 资产）; $（'＃table_body'）。on（'click'，'。delete-btn'，function（e）{
 var $ row = $（this）.closest（'tr'）， 
 rowId = $ row.data（'id'）; 
 var assetKey = rootRef.child（id）; 
 //它将删除这里的firebase对象
 （）; 
 $ row.remove（）; 
} ）
 //捕获错误
 .catch（function（error）{
 console.log（'ERROR'）; 
}）; 
}）; 
 $ b rootRef.on（child_changed，snap => {
 
 var assetKey = snap.child（id）.val（）; 
 var val（）; 
 $ b $（＃table_body）。 .append（< tr data-id ='+ assetKey +'>+ 
< td>+ name +< / td>+ 
< td> ;+ brand +< / td>+ 
 
< td>< div按钮>+ 
< button class ='delete-btn> delete< / button>+ 
< / div>< / td>< / tr>）; 
}）; 
  

assetKey 位于 rootRef.on（child_changed，snap => {如果在console.log中显示，则返回对象键的正确值，但是在 $（＃table_body）。on（'click'，'。delete-btn'，函数（e）{不能正常工作...

的不存在的 id 属性）解决方案c> Assets node）：

  var assetKey = rootRef.child（id）; 
  

试试这个：

  var rowId = $ row.data（'id'）; 
 rootRef.child（rowId）.remove（）
 ... 
  

I am setting some objects on firebase-database, and showing them on a HTML table with 'child_added' and append() to dynamically add them as soon as they are added to the database, and there has to be a delete button on each row of the table, but the problem is, I can't get this delete button to work...

This is how the database structure looks like:

Assets: {
    -KkBgUmX6BEeVyrudlfK: {
        id: '-KkBgUmX6BEeVyrudlfK',
        name: 'John',
        brand: 'HP'
    }
    -KkDYxfwka8YM6uFOWpH: {
        id: '-KkDYxfwka8YM6uFOWpH',
        name: 'Jack',
        brand: 'Dell'
    }
}

And this is my index.js:

var rootRef = firebase.database().ref().child("Assets");
$("#table_body").on('click','.delete-btn', function(e){
    var $row = $(this).closest('tr'),
       rowId = $row.data('id');
    var assetKey = rootRef.child("id");
    //it should remove the firebase object in here
    rootRef.child(assetKey).remove()
    //after firebase confirmation, remove table row
    .then(function() {
      $row.remove();
    })
    //Catch errors
    .catch(function(error) {
      console.log('ERROR');
    });  
});

rootRef.on("child_changed", snap => {

  var assetKey = snap.child("id").val();
  var name = snap.child("name").val();
  var brand = snap.child("brand").val();

$("#table_body").append("<tr data-id='"+assetKey+"'>"+
                          "<td>" + name + "</td>" +
                          "<td>" + brand + "</td>" +

                          "<td><div buttons>"+
                                  "<button class='delete-btn>delete</button>"+
                                  "</div></td></tr>");
});

The assetKey that is inside rootRef.on("child_changed", snap => { if showed on console.log returns the right value for the object key, but the 'assetKey' on $("#table_body").on('click','.delete-btn', function(e){ is not working properly...

解决方案

This line looks wrong to me (trying to get the nonexistent id property of the top level Assets node):

var assetKey = rootRef.child("id");

Try this instead:

var rowId = $row.data('id');
rootRef.child(rowId).remove()
...

这篇关于使用JavaScript从firebase中移除对象的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！