+ Start a Discussion
Ankit Khiwansara 10Ankit Khiwansara 10 

LWC Object rendering without track

import { LightningElement} from "lwc";

export default class ReactivityExample extends LightningElement {
  bool = true;
  number = 42;
  obj = { name: "John" };

  checkMutation() {
    this.bool = false; // Mutation detected

    this.number = 42; // No mutation detected: previous value is equal to the newly assigned value
    this.number = 43; // Mutation detected

    this.obj.name = "Bob"; // No mutation detect: 
  }
}
 
<template>
  <p>Boolean value : {bool}</p>
  <p>Number value : {number}</p>
  <p>Object value : {obj.name}</p>
  <lightning-button
    class="slds-var-m-around_small"
    variant="brand"
    label="Check Mutation"
    onclick={checkMutation}
  ></lightning-button>
</template>
In the above example, after clicking on checkMutation, my object property has been changed to Bob. I believe ideally it should not change and value should remain the same as John

Note - I am not using a track decorator here.

 
veer soniveer soni
hi Ankit,
It's working fine. you don't need track property for reRander the value. In  lwc we can set property without @Track  and it will work like track.

Thank you
AbhinavAbhinav (Salesforce Developers) 
"Like all fields as of Spring ’20, they’re reactive.
Before Spring ’20, to make the component rerender when a user entered a first or last name, you had to decorate the fields with @track."

Observe an Object’s Properties
To tell the framework to observe changes to the properties of an object, decorate the field with @track.
NOTE As discussed earlier, without using @track, the framework observes changes that assign a new value to the field. If the new value is not === to the previous value, the component rerenders.

Check this doc for details:

https://developer.salesforce.com/docs/component-library/documentation/en/lwc/lwc.reactivity_fields

Thanks!
Ankit Khiwansara 10Ankit Khiwansara 10
Hi Abhinav and Veer - 

Observe an Object’s Properties (As per documentation) 
To tell the framework to observe changes to the properties of an object, decorate the field with @track.  -->

In my case I have not decorated object properties with @track, still onsubmit , my value has been changed to "Bob". Ideally I believe it should be John only
mukesh guptamukesh gupta
Hi Ankit,

Best url for your understanding :-

https://developer.salesforce.com/docs/component-library/documentation/en/lwc/lwc.reactivity_fields

if you need any assistanse, Please let me know!!

Kindly mark my solution as the best answer if it helps you.

Thanks
Mukesh 
Ankit Khiwansara 10Ankit Khiwansara 10
Hi Mukesh,

As per documentation, the below statement should not mutate obj, but in my scenario, it does. this.obj got mutate to Bob value

this.obj.name = 'Bob'; // No mutation detect: `obj` field value is not reassigned