Lightning Aura Components Developer Guide

Introducing Aura Components
Quick Start
Creating Components
Using Components
Communicating with Events
Actions and Events
Handling Events with Client-Side Controllers
Component Events
Component Event Propagation
Create Custom Component Events
Fire Component Events
Handling Component Events
Component Event Example
Application Events
Event Handler Behavior for Active Components
Event Handling Lifecycle
Advanced Events Example
Firing Events from Non-Aura Code
Events Best Practices
Events Fired During the Rendering Lifecycle
Events Handled in the Salesforce Mobile App and Lightning Experience
System Events
Communicating Across the DOM with Lightning Message Service
Creating Apps
Styling Apps
Developing Secure Code
Using JavaScript
Working with Salesforce Data
Testing Components
Debugging
Performance
Reference
PDF

Note: This release is in preview. Features described here don’t become generally available until the latest general availability date that Salesforce announces for this release. Before then, and where features are noted as beta, pilot, or developer preview, we can’t guarantee general availability within any particular time frame or at all. Make your purchase decisions only on the basis of generally available products and features.

Create Custom Component Events

Create a custom component event using the <aura:event> tag in a .evt resource. Events can contain attributes that can be set before the event is fired and read when the event is handled.

Use type="COMPONENT" in the <aura:event> tag for a component event. For example, this c:compEvent component event has one attribute with a name of message.

1<!--c:compEvent-->
2<aura:event type="COMPONENT">
3    <!-- Add aura:attribute tags to define event shape.
4         One sample attribute here. -->
5    <aura:attribute name="message" type="String"/>
6</aura:event>

The component that fires an event can set the event’s data. To set the attribute values, call event.setParam() or event.setParams(). A parameter name set in the event must match the name attribute of an <aura:attribute> in the event. For example, if you fire c:compEvent, you could use:

1event.setParam("message", "event message here");

The component that handles an event can retrieve the event data. To retrieve the attribute value in this event, call event.getParam("message") in the handler’s client-side controller.