Lightning Aura Components Developer Guide

Introducing Aura Components
Quick Start
Creating Components
Using Components
Aura Component Bundle Design Resources
Use Aura Components in Lightning Experience and the Salesforce Mobile App
Navigate Across Your Apps with Page References
Basic Navigation
Add Links to Lightning Pages from Your Custom Components
Add Query Parameters
Navigate to a Record Create Page with Default Field Values
Navigate to a Web Page
Migrate to lightning:isUrlAddressable from from force:navigateToComponent
pageReference Types
Get Your Aura Components Ready to Use on Lightning Pages
Use Aura Components in Experience Builder
Use Aura Components with Flows
Add Components to Apps
Integrate Your Custom Apps into the Chatter Publisher
Using Background Utility Items
Use Lightning Components in Visualforce Pages
Use Aura and Lightning Web Components Outside of Salesforce with Lightning Out (Beta)
Lightning Container
Communicating with 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

Basic Navigation

The pageReference JavaScript object represents a URL for a page. You can use a pageReference instead of parsing or creating a URL directly. This approach helps you avoid broken navigation if Salesforce changes URL formats in the future.
Use the following resources to simplify navigation across your apps. URLs for components using these resources are case-sensitive. For examples, see the Component Library.

Navigation isn’t supported for inactive pages. A page is considered inactive if it’s not currently visible in the DOM, such as a minimized page.

Important

lightning:navigation

To navigate to a page or component, use the navigate(pageReference, replace) method from lightning:navigation. This approach is a substitute for a navigateTo* event, and both are supported.

When you navigate to a page reference from a modal, such as from a component that’s enabled for quick actions, the modal isn’t automatically closed by default. To automatically close the modal when navigating to another page reference, set replace to true.

To generate a URL in your component, use the generateUrl() method in lightning:navigation to resolve the URL.

generateUrl() returns a promise, which calls back with the resulting URL.

Note

lightning:isUrlAddressable

To enable a component to navigate directly via a URL, add the lightning:isUrlAddressable interface to your component.

pageReference and lightning:isUrlAddressable replace the force:navigateToComponent event for navigating directly to a component. Unlike the force:navigateToComponent event information-mapping protocol, the only attribute populated through the navigation dispatching system is the pageReference attribute. Information is passed to the addressed component through the state properties on the target page reference. lightning:isUrlAddressable doesn’t automatically set attributes on the target component. Get parameters from v.pageReference.state and manually set them using the target component’s init handler.

Tip

pageReference provides a well-defined structure that describes the page type and its corresponding attributes. pageReference supports the following properties.

Property Type Description Required?
type String The API name of the pageReference type, for example, standard__objectPage. Y
attributes Object Values for each attribute specified by the page definition, for example, objectAPIName or actionName. Y
state Object Parameters that are tied to the query string of the URL in Lightning Experience, such as filterName. The routing framework doesn’t depend on state to render a page. Some page reference types support a standard set of state properties. You can also pass non-standard properties into state as long as they’re namespaced.

Note: Experience Builder sites don’t support the state property.