Skip to content

Instantly share code, notes, and snippets.

@sjurgis
Created February 14, 2022 00:29
Show Gist options
  • Save sjurgis/b0cc0efa193cde23e774089210a6984d to your computer and use it in GitHub Desktop.
Save sjurgis/b0cc0efa193cde23e774089210a6984d to your computer and use it in GitHub Desktop.
lightning aura component tabset with url navigation
<aura:component implements="force:appHostable, lightning:hasPageReference" >
<lightning:navigation aura:id="navigation"/>
<lightning:tabset variant="vertical" selectedTabId="{!v.pageReference.state.c__tab}">
<lightning:tab label="Item One" id="one" onactive="{!c.handleActive}">
First
</lightning:tab>
<lightning:tab label="Item 2" id="two" onactive="{!c.handleActive}">
second
</lightning:tab>
<lightning:tab label="Item 3" id="three" onactive="{!c.handleActive}">
third
</lightning:tab>
</lightning:tabset>
</aura:component>
({
handleActive: function (component, event, helper) {
event.preventDefault();
event.stopPropagation();
function getUpdatedPageReference(stateChanges) {
return Object.assign({}, component.get('v.pageReference'), {
state: Object.assign({}, component.get('v.pageReference.state'), stateChanges)
});
}
component.find('navigation').navigate(
getUpdatedPageReference({
c__tab: event.getSource().get('v.id')
}), true);
}
});
You must replace c__tab to myNs__tab if you are working with managed package
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment