Firebase child_added会创建重复项

时间:2013-09-26 03:57:52

标签: firebase

我正在使用Firebase开发HTML5移动消息应用。我遇到了一个我无法解决的问题。该应用程序有多个频道(聊天室)。当第一次向频道添加消息时,它按预期工作但当我转到另一个频道并向该频道发布新消息时,我返回到上一个频道并发布另一条消息我得到上次发布的重复消息信息。当我重新加载页面时,重复项目已经消失,但我不希望重复显示。以下是我的代码:

function loadChatMessages(channelID) {
    $('#chatMessages').html('');
    var msgObj = {};
    var channelRef = globals.channelsBase + '/' + channelID + '/messages';

    var channelMessages = new Firebase(channelRef);
    channelMessages.on('child_added', function (snapshot) {
        msgObj = snapshot.val();
        var id = snapshot.name().toString();

            var messageTime = application.Functions.renderTime(msgObj.messageTime);
            var tails = '<div class="message-tails-wrap"><div class="message-tails"></div></div>';
            var html = '<li class="chatEl ' + sentByClass + '" id="'+id+'">';
            html += tails;
            html += msgObj.message;
            html += '<span class="sender"> ' + by + ' </span> <span class="tmp-recipient"> ' + msgObj.recipient + ' </span>';
            html += '<span class="time-stamp msg-time" >';
            html += messageTime;
            html += '</span></li>';
            $(html).appendTo('#chatMessages');

        /// TODO: TEMP solution!
        var prevID = 0;
        $('#chatMessages li').each(function(n) {
            var id = $(this).attr('id');
            if(id == prevID){
               // console.log(id + ' is a duplicate. Remove it');
                this.remove(); // the necessary evil....                 
            }
            prevID = id;
        });

    });

}

2 个答案:

答案 0 :(得分:5)

听起来每次进入房间时都会运行loadChatMessages(),当您的用户在房间内移动时,您会看到对on('child_added'回调的重复通话。

这是因为您每次重新进入房间时都会添加新的回调。要解决此问题,请在用户离开房间时进行一些清理。在该清理功能中,请确保使用.off("child_added")删除旧的侦听器。

答案 1 :(得分:1)

活动:

YOURREF.limitToLast(1).on('child_added', function (OBJECTADDED){
    console.log(OBJECTADDED.key(), OBJECTADDED.val());
});

您可能认为上述代码会被触发一次,但事实并非如此。上面的console.log将被触发两次,一次使用OBJECTADDED作为引用YOURREF中的最后一个对象,然后再添加新对象,另一个使用新对象。