Lightning Components Developer Guide
jSummer '26 (API version 67.0)
Spring '26 (API version 66.0)
Winter '26 (API version 65.0)
Summer '25 (API version 64.0)
Spring '25 (API version 63.0)
Winter '25 (API version 62.0)
Summer '24 (API version 61.0)
Spring '24 (API version 60.0)
Winter '24 (API version 59.0)
Summer '23 (API version 58.0)
Spring '23 (API version 57.0)
Winter '23 (API version 56.0)
Summer '22 (API version 55.0)
Spring '22 (API version 54.0)
Winter '22 (API version 53.0)
Summer '21 (API version 52.0)
Spring '21 (API version 51.0)
Winter '21 (API version 50.0)
Summer '20 (API version 49.0)
Spring '20 (API version 48.0)
Winter '20 (API version 47.0)
Summer '19 (API version 46.0)
Spring '19 (API version 45.0)
Winter '19 (API version 44.0)
Summer '18 (API version 43.0)
Spring '18 (API version 42.0)
Winter '18 (API version 41.0)
Summer '17 (API version 40.0)
Spring '17 (API version 39.0)
Winter '17 (API version 38.0)
Summer '16 (API version 37.0)
Spring '16 (API version 36.0)
Winter '16 (API version 35.0)
Summer '15 (API version 34.0)
Spring '15 (API version 33.0)
Winter '15 (API version 32.0)
App Overview
Designing App UI
Creating App Templates
Dynamically Creating Components
Detecting Data Changes with Change Handlers
Finding Components by ID
Dynamically Adding Event Handlers
Dynamically Showing or Hiding Markup
Adding and Removing Styles
Which Button Was Pressed?
Using the AppCache
Distributing Applications and Components
Newer Version Available
JavaScript Cookbook
This section includes code snippets and samples that can be used in various
JavaScript files.
-
Dynamically Creating Components
Create a component dynamically in your client-side JavaScript code by using the $A.createComponent() method. To create multiple components, use $A.createComponents(). -
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. -
Finding Components by ID
Retrieve a component by its ID in JavaScript code. -
Dynamically Adding Event Handlers
You can dynamically add a handler for an event that a component fires. The component can be created dynamically on the client-side or fetched from the server at runtime. -
Dynamically Showing or Hiding Markup
Use CSS to toggle markup visibility. You could use the <aura:if> tag to do the same thing but we recommend using CSS as it’s the more standard approach. -
Adding and Removing Styles
You can add or remove a CSS style on a component or element during runtime. -
Which Button Was Pressed?
To find out which button was pressed in a component containing multiple buttons, use Component.getLocalId().