Lightning Aura Components Developer Guide

Lightning Aura Components Developer Guide

Version 53.0, Winter '22

@salesforcedocs

Last updated: September 9, 2021

? Copyright 2000?2021 , inc. All rights reserved. Salesforce is a registered trademark of , inc., as are other names and marks. Other marks appearing herein may be trademarks of their respective owners.

CONTENTS

Chapter 1: What Is the Lightning Component Framework? . . . . . . . . . . . . . . . . . . . . . . 1 What is Salesforce Lightning? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 2 Why Use the Aura Components Programming Model? . . . . . . . . . . . . . . . . . . . . . . . . . . . . 2 Aura Components . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 2 Events . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 3 Browser Support for Aura Components . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 3 My Domain Is Required to Use Lightning Components in Your Salesforce Org . . . . . . . . . . . . . 4 Using the Developer Console . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 4 Online Content . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 5

Chapter 2: Quick Start . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 6 Before You Begin . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 7 Trailhead: Explore Lightning Aura Components Resources . . . . . . . . . . . . . . . . . . . . . . . . . . 7 Create a Component for Lightning Experience and the Salesforce Mobile App . . . . . . . . . . . . . 8

Load the Contacts . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 11 Fire the Events . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 15

Chapter 3: Creating Components . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 17 Component Names . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 19 Create Aura Components in the Developer Console . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 19

Lightning Bundle Configurations Available in the Developer Console . . . . . . . . . . . . . . . 20 Create Aura Components Using Salesforce CLI . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 21 Component Markup . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 25 Component Namespace . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 26

Using the Default Namespace in Organizations with No Namespace Set . . . . . . . . . . . . 26 Using Your Organization's Namespace . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 27 Using a Namespace in or from a Managed Package . . . . . . . . . . . . . . . . . . . . . . . . . 27 Creating a Namespace in Your Organization . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 27 Namespace Usage Examples and Reference . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 28 Component Bundles . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 30 Component IDs . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 31 HTML in Components . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 32 Supported HTML Tags . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 33 CSS in Components . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 34 Component Attributes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 36 Supported aura:attribute Types . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 37 Basic Types . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 38 Function Type . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 40 Object Types . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 40

Contents

Standard and Custom Object Types . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 40 Collection Types . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 41 Custom Apex Class Types . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 43 Framework-Specific Types . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 44 Using Expressions . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 46 Dynamic Output in Expressions . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 47 Conditional Expressions . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 48 Data Binding Between Components . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 48 Value Providers . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 53 Expression Evaluation . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 60 Expression Operators Reference . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 61 Expression Functions Reference . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 64 Component Composition . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 68 Component Body . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 71 Component Facets . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 72 Controlling Access . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 73 Application Access Control . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 76 Interface Access Control . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 76 Component Access Control . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 76 Attribute Access Control . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 77 Event Access Control . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 77 Using Object-Oriented Development . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 77 Favor Composition Over Inheritance . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 78 What is Inherited? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 78 Inherited Component Attributes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 79 Abstract Components . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 81 Interfaces . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 81 Inheritance Rules . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 82 Best Practices for Conditional Markup . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 83 Aura Component Versioning for Managed Packages . . . . . . . . . . . . . . . . . . . . . . . . . . . . 84 Base Components with Minimum API Version Requirements . . . . . . . . . . . . . . . . . . . . . . . 85 Validations for Aura Component Code . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 87 Validation When You Save Code Changes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 87 Validation During Development Using the Salesforce CLI . . . . . . . . . . . . . . . . . . . . . . . 88 Review and Resolve Validation Errors and Warnings . . . . . . . . . . . . . . . . . . . . . . . . . . 92 Aura Component Validation Rules . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 93 Salesforce Lightning CLI (Deprecated) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 99 Using Labels . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 99 Using Custom Labels . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 100 Input Component Labels . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 101 Dynamically Populating Label Parameters . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 101 Getting Labels in JavaScript . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 102 Getting Labels in Apex . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 103 Setting Label Values via a Parent Attribute . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 104

Contents

Localization . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 105 Working with Base Lightning Components . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 107

Base Lightning Components Considerations . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 114 Event Handling in Base Lightning Components . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 116 Creating a Form . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 119 Validating Fields . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 121 Lightning Design System Considerations . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 123 Migrate Components from the ui Namespace . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 126 Supporting Accessibility . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 129 Button Labels . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 130 Audio Messages . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 131 Forms, Fields, and Labels . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 132 Using Images and Icons . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 132 Events . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 134 Menus . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 134 Writing Documentation for the Component Library . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 134 Creating Examples . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 135 Creating Documentation Content . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 136 Providing Specification Information and Descriptions . . . . . . . . . . . . . . . . . . . . . . . . 139

Chapter 4: Using Components . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 141

Aura Component Bundle Design Resources . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 142 Use Aura Components in Lightning Experience and the Salesforce Mobile App . . . . . . . . . . 145

Configure Components for Custom Tabs . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 145 Add Aura Components as Custom Tabs in a Lightning Experience App . . . . . . . . . . . . 146 Lightning Component Actions . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 146 Override Standard Actions with Aura Components . . . . . . . . . . . . . . . . . . . . . . . . . . 153 Navigate Across Your Apps with Page References . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 157 Basic Navigation . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 158 Add Links to Lightning Pages from Your Custom Components . . . . . . . . . . . . . . . . . . . 159 Add Query Parameters . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 160 Navigate to a Record Create Page with Default Field Values . . . . . . . . . . . . . . . . . . . . 160 Navigate to a Web Page . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 163 Migrate to lightning:isUrlAddressable from force:navigateToComponent . . . . . . . . . . . 163 pageReference Types . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 165 Get Your Aura Components Ready to Use on Lightning Pages . . . . . . . . . . . . . . . . . . . . . . 177 Configure Components for Lightning Pages and the Lightning App Builder . . . . . . . . . . 178 Configure Components for Lightning Experience Record Pages . . . . . . . . . . . . . . . . . . 180 Create Components for the Outlook and Gmail Integrations . . . . . . . . . . . . . . . . . . . . 181 Create Dynamic Picklists for Your Custom Components . . . . . . . . . . . . . . . . . . . . . . . 185 Create a Custom Lightning Page Template Component . . . . . . . . . . . . . . . . . . . . . . . 187 Lightning Page Template Component Best Practices . . . . . . . . . . . . . . . . . . . . . . . . . 190 Make Your Lightning Page Components Width-Aware with lightning:flexipageRegionInfo . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 191

 ................
................

In order to avoid copyright disputes, this page is only a partial summary.

Google Online Preview   Download