Activity Forums Salesforce® Discussions How can we navigate from one component to another component in Salesforce Lightning?

  • shariq

    Member
    September 22, 2018 at 4:03 pm

    Yes. With the help of lightning:navigate tag and then use the page reference in JS Controller.

  • Parul

    Member
    September 22, 2018 at 4:33 pm

    <ul class="slds-list--horizontal slds-has-dividers_around-space" onclick="{!c.click}">

    <lightning:layout >
    <lightning:layoutItem size="3" padding="around-small">
    <div class="img " >
    <img  style="height: 100px;" src="/resource/Images/Assets/1.png"  />
    <h1>TEXT1</h1>
    </div>
    </lightning:layoutItem>
    <lightning:layoutItem size="3" padding="around-small">
    <div class="img1" >
    <img style="height: 100px;" src="/resource/Images/Assets/2.png"  />
    <h1>TEXT2</h1>
    </div>
    </lightning:layoutItem>
    <lightning:layoutItem size="3" padding="around-small">
    <div class="img2" ><img style="height: 100px;" src="/resource/Images/Assets/3.png" align="middle" />
    <h1>TEXT3</h1>
    </div>
    </lightning:layoutItem>
    <lightning:layoutItem size="3" padding="around-small">
    <div class="img3"  style="text-align: left">
    <img style="height: 100px;" src="/resource/Images/Assets/4.png"/>
    <h1>TEXT4</h1>
    </div>
    </lightning:layoutItem>
    </lightning:layout>

    </ul>

    Controller.Js

    click:function(component,event,helper){

    var evt = $A.get("e.force:navigateToComponent");
    evt.setParams({
    componentDef : "c:Component2",

    });

    evt.fire();
    }

    Thanks

Log In to reply.

Popular Salesforce Blogs

Popular Salesforce Videos