2

I am getting a Proxy object instead of an actual component attribute. I saw the question and it did not help me.

Here is my code:

campingApp.app :

<aura:application >
    <c:camping/>
</aura:application>

camping.cmp :

<aura:component >
    <c:campingHeader/>
    <c:campingList/>
</aura:component>

campingHeader.cmp :

<aura:component >
    <h1>Camping List</h1>
</aura:component>

campingList.cmp :

<aura:component >
    <ol>
        <li>Bug Spray</li>
        <li>Bear Repellant</li>
        <li>Goat Food</li>
    </ol>
    <c:campingListItem/>
</aura:component>

campingListItem.cmp :

<aura:component >
    <aura:attribute name="item" type="Camping_Item__c" required="true" default="{ 
                        'sobjectType': 'Camping_Item__c',
                        'campingItemName': 'SSSSSSSSSSSSSSSSS',
                        'price__c': 0,
                        'quantity__c': '555555',
                        'packed__c': false }"/>
    <p>{!v.item.campingItemName}</p>
    <p>Price:
        <lightning:formattedNumber value="{!v.item.price__c}" style="currency"/>
    </p>
    <p>Quantity:
        <lightning:formattedNumber value="{!v.item.quantity__c}"/>
    </p>
    <lightning:input type="toggle"                            
                         label="Packed: "                           
                         name="packed"                         
                         checked="{!v.item.packed__c}" />
    <lightning:button label="Packed!"
            onclick="{!c.packItem}"/>
</aura:component>

campingListItemController.js :

({
    packItem : function(component, event, helper) {
        console.log(component);
        var item = component.get("v.item");
        console.log("item.quantity__c: " + item.quantity__c);
        item.packed__c = true;
        console.log(item);
        component.set("v.item", item);

        var button = event.getSource();
        button.set("v.disabled", true);
        console.log(button);
    }
})

Here is the console after previewing the campingApp.app and the Packed! button being clicked:

enter image description here

My main purpose here is to set the item.packed__c to true and update all the places where it is used. I can do that with these lines:

item.packed__c = true;
component.set("v.item", item);

But before these lines I should have the components attribute named item in the item variable. I am trying to achieve this by the following line:

var item = component.get("v.item");

But as you can see instead of the item I am getting some weird Proxy object which really do not provide me any kind of access to the underlying item.

What am I doing wrong here?

4
  • lightning is case sensitive. Can you check the FieldNames in code and Schema same? May 20 '18 at 16:24
  • 2
    The proxy may be the correct object: proxies are used a lot in Lightning. In the console output '' + item or JSON.stringify(item) and see what the proxy resolves to.
    – Keith C
    May 20 '18 at 16:41
  • @KeithC, great. JSON.stringify(item) outputs what is expected. But what is next? How should I work with the object? May 20 '18 at 17:47
  • You can set values as you show in your code e.g. item.packed__c = true;. But take care with casing as JavaScript is case sensitive: I would expect the API name of the SObject field to be Packed__c.
    – Keith C
    May 20 '18 at 18:28
10

The best solution I found for this is to do the following:

const objUncovered = JSON.parse(JSON.stringify(objWhichIsCoveredWithProxy));

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.