getSelectedNavigationItem() for Lightning Experience

Returns information about the selected navigation item. This method works only in Lightning console apps.

Arguments

None

LWC Sample Code

This example identifies the specific navigation menu item currently active in a Lightning console app.

1import { LightningElement } from 'lwc';
2import { getSelectedNavigationItem } from 'lightning/platformNavigationItemApi';
3 
4export default class MyComponent extends LightningElement {
5    selectedItem;
6      
7    async loadSelectedItem() {
8        try {
9            this.selectedItem = await getSelectedNavigationItem();
10            console.log('Current navigation item:', this.selectedItem.label);
11            console.log('Developer name:', this.selectedItem.developerName);
12            console.log('Page reference:', this.selectedItem.pageReference);
13        } catch (error) {
14            console.error('No selected navigation item:', error);
15        }
16    }
17}

This example checks if a specific object is the current navigation item.

1import { LightningElement } from 'lwc';i
2mport { getSelectedNavigationItem } from 'lightning/platformNavigationItemApi';
3
4export default class MyComponent extends LightningElement {
5    async isCurrentlyOnAccounts() {
6        try {
7            const selectedItem = await getSelectedNavigationItem();
8            return selectedItem.pageReference?.attributes?.objectApiName === 'Account';
9        } catch (error) {
10            console.error('Error checking navigation:', error);
11            return false;
12        }
13    }
14}

Aura Components Sample Code

This component has a button that, when pressed, returns information about the selected navigation item.

Component code:

1<aura:component implements="flexipage:availableForAllPageTypes" access="global">
2    <lightning:navigationItemAPI aura:id="navigationItemAPI"/>
3    <lightning:button label="Get selected navigation item" onclick="{!c.getSelectedNavigationItem}"/>
4</aura:component>

Controller code:

1({
2    getSelectedNavigationItem : function(component, event, helper) {
3        var navigationItemAPI = component.find("navigationItemAPI");
4        navigationItemAPI.getSelectedNavigationItem().then(function(response) {
5            console.log(response);
6        })
7        .catch(function(error) {
8            console.log(error);
9        });
10    }
11})

Response

This method returns a promise that, upon success, resolves to a navigationItemInfo object. The promise is rejected on error.

The navigationItemInfo object has the following fields.

Name	Type	Description
`label`	string	The navigation item’s label, such as `Account` or `Case`.
`developerName`	string	The navigation item’s developer name that uniquely identifies the item. For example, `Salesforce_Account` or `Your_VF_Page_Name`.
`selected`	boolean	True if the tab is currently selected, false otherwise.
`pageReference`	object	The representation of the current page. The object returns information such as: page type (for example `standard__objectPage` or `standard__navItemPage`), object API name, and state information for the page.

Here’s the structure of a navigationItemInfo object.

1{
2      developerName : string,
3      label : string,
4      pageReference: object,
5      selected : boolean
6}

The PageReference structure looks like this.

1{
2    type: 'standard__objectPage',
3    attributes: {
4        objectApiName: 'Account',
5        actionName: 'home'
6    },
7    state: {
8        // Optional state parameters
9    }
10}