In this post we will learn about the tag force:navigatetoComponent is use to navigate within the Salesforce Lightning Component. Here we are going to learn navigation within component using Event that navigate only for tab not as a Lightning app.
Step1: Create a Parent Lightning Component
<aura:component implements="force:appHostable" access="global"></aura:component>
Step2: Create Parent Controller
({
NavigatetoChildComp : function(component, event, helper) {
console.log('Enter Here');
var evt = $A.get("e.force:navigateToComponent");
console.log('evt'+evt);
evt.setParams({
componentDef: "c:Component2"
});
evt.fire();
}
})
Step3: Create Child Lightning Component
<aura:component implements="force:appHostable" access="global"></aura:component>
Step4: Create Child controller
({
NavigatetoParentComp : function(component, event, helper) {
var evt = $A.get("e.force:navigateToComponent");
evt.setParams({
componentDef : "c:Component1"
});
evt.fire();
}
})
Now, we have to create one Lightning Tab.Go to App Manager add this Lightning component to this tab.
So this is how you can use the force:navigateToComponent in the Aura Component.
If you have any suggestions or issue with it, you can post in comment box.
Happy Learning
For using force:navigateToComponent in Lightning Web Component see, http://forceblogs.com/lightning-navigation-service-in-lightning-web-component/
Resource: https://developer.salesforce.com/docs/component-library/bundle/force:navigateToComponent
Support:
For any further Salesforce support, Chat with us.
Recent Comments