Contents
However, there is a workaround, if you want to navigate the user from one LWC to another LWC, you can embed LWC in an Aura Component and navigate the user from LWC to an Aura Component. Out of the box, LWC framework provides us helper methods to send the user from Lightning Web Component to an Aura Component.
How do I open LWC components?
Create a Lightning Web Component
- In Visual Studio Code, open the Command Palette by pressing Ctrl+Shift+P (Windows) or Cmd+Shift+P (macOS).
- Type SFDX .
- Select SFDX: Create Lightning Web Component.
- Enter helloWorld for the name of the new component.
- Press Enter to accept the default force-app/main/default/lwc.
To navigate from a Lightning component to another, specify the component name using componentDef . This example navigates to a component c:myComponent and sets a value on the contactId attribute. The componentAttributes are base-64 encoded into the URL.
How to send user from LWC to Aura?
Let’s look at the snippet to send a user from LWC to Aura Component (that has another LWC embedded in it). This is the controller file of the Web Component. This is how the configuration object is going to look like and pretty much all the info that we need to provide related to the navigation will be provided to this.
At times we do have to navigate the user to an Aura Component from Lightning Web Component. Let’s look at how something like that can be done. Template file is going to be pretty much straightforward. We will be having a button and on click of the button user gets navigated.
How to navigate from one LWC to another LWC?
It’s such a bummer that we cannot navigate from one Lightning Web component to another Lightning Web Component. However, there is a workaround, if you want to navigate the user from one LWC to another LWC, you can embed LWC in an Aura Component and navigate the user from LWC to an Aura Component.
Which is an example of an aura component?
Example In the trailheadapps/pure-aloe sample app, see the Aura irrigationWrapperManager component, which sets properties on the child irrigationManager Lightning web component. In Aura components and Lightning web components, you can add components into the body of another component.