---
schema_version: "1"
id: 5f1a2ad9d20d08f810bf2748b28f14f219b45c2efd78dc9e463220e1bbdf21a4
title: Detecting Data Changes with Change Handlers
collection: developer
version: current
locale: en-us
portal_url: https://docs.salesforce.com/developer/current/en-us/platform/aura-platform/guides/aura/js-cb/js-cb-data-change.md
canonical_url: https://developer.salesforce.com/docs/platform/aura-platform/guide/js-cb-data-change.html
source_site: developer.salesforce.com
content_type: documentation
content_hash: bf7788666492e9d78dacfeabaccd63ad40405c3acba1a477cd4f1f0273e5ad79
products:
  - Lightning Aura Components Developer Guide
  - Platform Developer Content
---

# Detecting Data Changes with Change Handlers

Configure a component to automatically invoke a change handler, which is a client-side controller action, when a value in one of the component's attributes changes.

When the value changes, the valueChange.evt event is automatically fired. The event has `type="VALUE"`.

In the component, define a handler with `name="change"`.

<!-- otherprops: set_clipboard -->
```nolang
<aura:handler name="change" value="{!v.numItems}" action="{!c.itemsChange}"/>
```

The `value` attribute sets the component attribute that the change handler tracks.

The `action` attribute sets the client-side controller action to invoke when the attribute value changes.

A component can have multiple `<aura:handler name="change">` tags to detect changes to different attributes.

In the controller, define the action for the handler.

<!-- otherprops: set_clipboard -->
```javascript
({
    itemsChange: function(cmp, evt) {
        console.log("numItems has changed");
        console.log("old value: " + evt.getParam("oldValue"));
        console.log("current value: " + evt.getParam("value"));
    }
})
```

The valueChange event gives you access to the previous value (`oldValue`) and the current value (`value`) in the handler action.

When a change occurs to a value that is represented by the `change` handler, the framework handles the firing of the event and rerendering of the component.

**See Also**  


-   [Invoking Actions on Component Initialization](https://developer.salesforce.com/docs/platform/aura-platform/guide/js-cb-init-handler.md)