如何检查 firebase 实时数据库中的更改值并使它们显示在 html 表中？

debugcn 发表于 Dev

埃比尼泽

一旦从数据库中删除条目，我就能够从表中删除条目，并且还能够在编辑条目后添加条目。如何使用firebase实时数据库检查数据是否已经在html表中？我现在正在寻找如何查找数据库的实时更改。

var database = firebase.database().ref().child('transactions');
database.on('child_added', function(snapshot){
    var data = snapshot.val();

    var content = '<tr id="'+snapshot.key+'">';
    content += '<td>' + data.CustomerName + '</td>';//column2
    content += '<td>' + data.TimeEffected + '</td>'; //column1 
    content += '<td>' + data.DateEffected + '</td>'; //column1
    content += '<td>' + data.Successful + '</td>'; //column1
    content += '</tr>';
    $('#ex-table').append(content);

    database.on('child_removed', function(snapshot){
        $('#'+snapshot.key).remove()
    });

});

我尝试使用这个：

database.on('child_changed', function(snapshot){
        $('#'+snapshot.key).change()
    });

我尝试将它放在 remove 方法下，但没有成功。

弗兰克·范·普费伦

在$('#'+snapshot.key)HTML中得到正确的元素，但jQuery的change()方法并没有做什么，你认为它。阅读链接的文档以了解它的实际作用。

如果您考虑一下这是否有意义：jQuery 的内置方法如何知道如何更新您的 HTML 结构？

只有您的代码知道它为快照中的数据创建了什么 HTML。您需要将在child_added回调中创建 HTML 的（部分）代码复制到child_changed回调中。

像这样的东西：

database.on('child_changed', function(snapshot){
    var data = snapshot.val();

    var content = '<tr id="'+snapshot.key+'">';
    content += '<td>' + data.CustomerName + '</td>';//column2
    content += '<td>' + data.TimeEffected + '</td>'; //column1 
    content += '<td>' + data.DateEffected + '</td>'; //column1
    content += '<td>' + data.Successful + '</td>'; //column1
    content += '</tr>';

    $('#'+snapshot.key).replaceWith(content)
});

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。