Lightening recordUpdated方法绑定触发过时数据事件

Question

我有一个照明组件，它将在更新操作时调用一个控制器方法。下面是组件、控制器和帮助器的代码:组件代码：

    <force:recordData aura:id="forceRecord"
        recordId="{!v.recordId}" 
        layoutType="FULL"
        targetRecord="{!v._record}"
        targetFields="{!v.simpleRecord}"
        targetError="{!v._error}"
        mode="EDIT"
        recordUpdated="{!c.recordUpdated}" />

控制器代码：

({
    doInit : function(component, event, helper) {
        helper.checkStatus(component,event,helper);        
    },

    recordUpdated : function(component, event, helper) {
        var changeType = event.getParams().changeType;

        console.log('changeType IS: '+ changeType);

        // changeType = LOADED  -- when record is created.
        if (changeType === "ERROR") { /* handle error; do this first! */ }
        else if (changeType === "LOADED") {
        }
        else if (changeType === "REMOVED") { /* handle record removal */ }
        else if (changeType === "CHANGED") {
            var recordId = component.get("v.recordId");
            console.log('Updated record Id: '+ recordId);
            helper.callAnotherMethod(component, event, helper);  
         }
    }
})

假设我在浏览器中访问payment (Id in URL: a001l000005JP5mAAG)页面，并修改了其中的一些字段并将其保存。调用recordUpdated方法，并进入已更改的if条件。

我在相同的浏览器窗口中打开一些其他付款(Id in URL: a001l000005HK5mBBK)，并修改此付款中的一个字段值并保存它。此时，recordUpdated方法被调用两次，一次用于旧付款，一次用于新付款。

如果我查看浏览器控制台，我会看到如下日志：

changeType IS: CHANGED
Updated record Id: a001l000005JP5mAAG
changeType IS: CHANGED
Updated record Id: a001l000005HK5mBBK

不确定为什么它会调用两次，以及如何停止它？谁能解释一下它为什么会这样，以及如何阻止它？

令人惊讶的是，如果我在同一个浏览器窗口中打开更多的支付并修改它们，它会一直为更新的当前支付添加recordUpdated事件，并使用它们的Id调用较早支付的更新事件。

Answer 1

经过大量的研究和深思熟虑，我理解这是一个问题，如果在同一浏览器窗口中查看多个相同的对象类型并生成事件，则会添加但不会删除事件侦听器。

我发现即使引发了多个事件，但如果我检查这些事件中已更改的字段，除了当前实例中已更改的字段外，它们将不会有任何数据，因此我开始检查已更改的字段，如下所示，如果它们在已更改的对象中没有任何元素，则我将继续操作。

    recordUpdated : function(component, event, helper) {
        var changeType = event.getParams().changeType;
        var changedFields = event.getParams().changedFields;

        console.log('changeType IS: '+ changeType);

        // changeType = LOADED  -- when record is created.
        if (changeType === "ERROR") { /* handle error; do this first! */ }
        else if (changeType === "LOADED") {
        }
        else if (changeType === "REMOVED") { /* handle record removal */ }
        else if (changeType === "CHANGED") {
            if (Object.keys(changedFields).length == 1 
                && Object.keys(Object.values(changedFields)[0])[0] == 'SystemModstamp')
            { 
                // this is a case where nothing modified but due to issue in lightning event handlers all the 
                // previous events are fired along with the current event, hence avoiding action on such events.
            }
            else
            {
                var recordId = component.get("v.recordId");
                console.log('To be updated record Id: '+ recordId);
                console.log('changedFields: '+ JSON.stringify(changedFields));

                helper.callAnyMethod(component, event, helper);
            }
        }

    },
    destoryCmp : function (component, event, helper) {
        component.destroy();
    },
})

这为我解决了这个问题。如果其他人遇到类似的问题，希望这篇文章能有所帮助。