1

I am using force:recordData to pull data for a Campaign on load of the component. The component is triggered by a quick action.

I understand that force:recordData is an asynchronous process. However does it execute as soon as the component that contains it loads?

I am getting inconsistent results.

Here's the code that I have in my component:

<aura:component controller="MyController" implements="force:lightningQuickAction,force:hasRecordId" >
    <aura:attribute name="recordId" type="String" />
    <aura:attribute name="record" type="Object" />
    <aura:attribute name="simpleRecord" type="Object" />

    <force:recordData aura:id="smartListRecord"
                recordId="{!v.recordId}"
                targetRecord ="{!v.record}"
                targetFields="{!v.simpleRecord}"
                fields="Id, Name"/>
<lightning:button label="Test"
                          onclick="{!c.testMethod}"/>

My JS controller:

({
    testMethod: function(component, event, helper) {
        console.log('Record Id:');
        console.log(component.get("v.recordId"));
        console.log('Record:');
        console.log(component.get("v.record"));
    }
})

I get the recordId but I can't see the record. What am I doing wrong?

Sometimes in the console I would get Proxy{} with a [[Handler]] and [[Target]] where the [[Target]] would hold the information about the campaign.

Other times the [[Target]] would come in as blank only holding a proto no matter how long I wait before I press the button.

Why is this happening?

4
  • 1
    what do you mean with, I cannot see the record? any errors? what do you see in your console output?
    – glls
    Jul 26, 2018 at 17:21
  • 1
    As far as I understand force:recordData does not necessarily load the record right when the component is initialized. Usually there is a very little time gap between when the is initialized and force:recordData gets loaded and the framework automatically fires an event whenever the record gets loaded or updated or deleted etc. You can handle these events by adding "recordUpdated" attribute to the force:recordData element and associating it with a Controller Function.Look at the example here: developer.salesforce.com/docs/atlas.en-us.lightning.meta/…
    – Nihar
    Jul 26, 2018 at 17:29
  • @Nihar - That's how I initially did it and I got the same result. I will update my answer with what I get in the console.
    – Arthlete
    Jul 26, 2018 at 17:33
  • @Nihar @glls - I understand that force:recordData is asynchronous. However does it start pulling data as soon as the page gets loaded?
    – Arthlete
    Jul 26, 2018 at 17:43

2 Answers 2

2

In order to correctly output a log of anything force:recordData does, you need to wait for it to resolve fully. Luckily, we have an attribute we can listen to, the recordUpdated attribute.

This should work:

Component

<force:recordData aura:id="smartListRecord"
            recordId="{!v.recordId}"
            targetRecord ="{!v.record}"
            targetFields="{!v.simpleRecord}"
            recordUpdated="{! c.handleRecordChanged }"
            fields="Id, Name"/>

Controller

handleRecordChanged: function(component, event, helper) {
  switch(event.getParams().changeType) {
    case "ERROR":
      // handle error
      break;
    case "LOADED":
      console.log(JSON.parse(JSON.stringify(component.get("v.record"))));
      console.log(JSON.parse(JSON.stringify(component.get("v.simpleRecord"))));
      console.log(component.get("v.simpleRecord")["Name"]);
      break;
    case "REMOVED":
      // stuff
      break;
    case "CHANGED":
      // more stuff
      break;
  }
}

FYI, you can debug properties like this: component.get("v.simpleRecord")["Name"]

Further reading for Lightning Data Service handling Record Changes

2
  • Thanks, but even with that the [[Target]] is coming in as blank. I am working in a scratch org(sfdx) so I wonder if it has something to do with permissions.
    – Arthlete
    Jul 26, 2018 at 19:12
  • 1
    @Arthlete - what happens if you write {! v.simpleRecord.Name } directly in the component somewhere? It should output Name. As you have it, you're not even telling LDS to grab more fields than Id and Name. Perhaps add more fields?
    – tsalb
    Jul 26, 2018 at 19:24
1

Actually, you do. Just not printing it right.

Try this:

({
    testMethod: function(component, event, helper) {
        console.log('Record Id:');
        console.log(component.get("v.recordId"));
        console.log('Record:');
        console.log(JSON.stringify(component.get("v.record"), null, 2));
})
2
  • @Arthlete and FYI, if you do JSON.parse(JSON.stringify(component.get("v.record")) you can use the collapse and expand in debug to see the nested items easier if you try to debug a JS Object
    – tsalb
    Jul 26, 2018 at 18:09
  • @tsalb - Yes you are correct. However sometimes I get content inside [[Target]] which is an object holding the Campaign's data and sometimes [[Target]] comes in as blank. I am not sure what is causing this inconsistent behavior.
    – Arthlete
    Jul 26, 2018 at 18:45

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .