0

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

    <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);  
         }
    }
})

假设我正在浏览器中访问付款（URL 中的 ID：a001l000005JP5mAAG）页面并修改其中的一些字段并保存它。调用 recordUpdated 方法并进入 CHANGED if 条件。

我在同一个浏览器窗口中打开了一些其他付款（URL 中的 ID：a001l000005HK5mBBK），并修改了此付款中的字段值并保存。此时 recordUpdated 方法被调用两次，一次用于旧付款，一次用于新付款。

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

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

不知道为什么它会调用两次以及如何阻止它？谁能解释我为什么会这样以及如何阻止它？

令人惊讶的是，如果我在同一个浏览器窗口中打开更多付款并对其进行修改，它会不断为当前付款更新添加 recordUpdated 事件，并使用其 ID 调用早期付款的更新事件。

4

1 回答 1

0

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

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

    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();
    },
})

这为我解决了问题。如果其他人面临类似问题，希望这可能会有所帮助。

于 2020-05-08T07:52:00.350 回答