function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
Pratik Raut 14Pratik Raut 14 

How to navigate/redirect from one lightning component to other component in lightning community

Hello,

I have two lightning components.I want to redirect from one lightning component to other.I used
var urlEvent = $A.get("e.force:navigateToURL");
urlEvent.setParams({ "url": "/lightning/cmp/c__ComponentName" });
urlEvent.fire();

This event is working properly in Lightning but not working in Lightning Communities.Any resolution on that or any other solution for redirection in communities

 
Khan AnasKhan Anas (Salesforce Developers) 
Hi Pratik,

Greetings to you!

According to Salesforce doc: https://developer.salesforce.com/docs/component-library/bundle/force:navigateToURL/documentation

Instead of using force:navigateToURL, we recommend navigating to web pages using the lightning:navigate component with the standard__webPage page type.

In standard navigation Lightning apps, you can use the lightning:navigation component to navigate to a custom component that implements lightning:isUrlAddressable.

https://developer.salesforce.com/docs/component-library/bundle/lightning:navigation/documentation

Please try the below code.

Component:
<aura:component implements="force:appHostable,flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId,forceCommunity:availableForAllPageTypes,force:lightningQuickAction,lightning:isUrlAddressable" access="global" >
    
    <aura:attribute name="url" type="String"/>
    <aura:attribute name="pageReference" type="Object"/>
    
    <aura:handler name="init" value="{! this }" action="{! c.init }"/>
    
    <lightning:navigation aura:id="navService"/>
    <lightning:button label="Navigate To Other Component" onclick="{!c.handleClick}"/>
</aura:component>

Controller:
({
    init : function(cmp, event, helper) {
    },
    
    handleClick : function(component, event, helper) {
        var navService = component.find("navService");
        var pageReference = {
            "type": "standard__component",
            "attributes": {
                "componentName": "c__Insert_Task"  // c__YourComponentName
            }
        }
        
        navService.navigate(pageReference);
    }   
})

To enable direct navigation to a Lightning component via URL, add the lightning:isUrlAddressableinterface to the component. This interface is used with the lightning:navigation component to navigate from one component to the URL-addressable component.

You need to implement lightning:isUrlAddressable in the component to which you want to navigate.

I hope it helps you.

Kindly let me know if it helps you and close your query by marking it as solved so that it can help others in the future. It will help to keep this community clean.

Thanks and Regards,
Khan Anas