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
Rakesh ChattyRakesh Chatty 

How to change URL in LWC,

Hi All,

I'm caling an LC component from Quick Actions which is navigatating to LWC component.
 > I want to open my component in new tab and change URL.
I'm able to change URL and open in new window but output is not showing.
can some suggest me how to change URL.

 

User-added image
I want URL to be /force.com/myComponentName/recid=123546

LC component
 

aura:component implements="force:appHostable,flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId,force:lightningQuickAction,lightning:isUrlAddressable" >
    <lightning:navigation aura:id="navService"/>
    <aura:attribute name="pageReference" type="Object"/>
    <aura:handler name="init" action="{!c.navigateToLC}" value="{!this}" />
</aura:component>

JS
navigateToLC : function(component, event, helper) {
        var pageReference = {
            type: 'standard__component',
            attributes: {
                componentName: 'c__myComponent_Lwc'
            },
            state: {
                c__refRecordId: component.get("v.recordId")
            }
        };
        component.set("v.pageReference", pageReference);
        const navService = component.find('navService');
        const pageRef = component.get('v.pageReference');
        const handleUrl = (url) => {
            window.open(url);
            console.log(component.get("v.recordId"))
        };
        const handleError = (error) => {
            console.log(error);
        };
        navService.generateUrl(pageRef).then(handleUrl, handleError);
    }
User-added image

Thanks in Advance.
​​​​
Yogendra JangidYogendra Jangid
Hello Rakesh,
The navigation service is not applicable for LWC component which is rendered standalone as a web component. The reason being the LWC does not support isurladdressable. If you wish to use LWC for navigation,
  1. Use aura to encapsulate LWC and use isurladdressable in the aura.
  2. Without aura using one.app# url.
You can refer below link on how to navigate to another LWC with/without using aura
https://inevitableyogendra.blogspot.com/2021/05/navigate-from-one-lwc-component-to-another-lwc-component.html

Hope this answers your question, if so please can you mark this as the best answer. Thanks