#

Navigation in LWC and passing the values without using the Aura component.

Why create one more component when you can bypass it?

While navigating from one Salesforce Lightning Web Component to another Salesforce LWC, you’ll need a PageReference Object of Lightning Component Type that works only in the Salesforce Lightning Experience Salesforce Mobile App. This can be achieved by creating an additional Aura Component, but to do so you need to implement lightning:isUrlAddressable which will be added as an interface to directly navigate to Lightning Component via URL.

This blog will help you to navigate and pass values from Salesforce Lightning Web Component to another Lightning Web Component without creating an Aura Component. Let’s dive in.

Create two Salesforce Lightning Web Component,

  • sourcelwc
  • targetlwc

As the name suggests, sourcelwc will be responsible for taking user input and passing it to targetlwc. Enough talks let’s see the real magic.

Sourcelwc.html

This file has a button with the label name NAME which will navigate you to another lightning web component when you click on it.

Sourcelwc.js

The file defines the handleClick method and links it with the button in HTML markup to create a URL in the Base64 encoded form.

sourcelwc.js-meta.xml

Targetlwc

This creates is an input text field for displaying user input.

Tagerlwc.html

Tagerlwc.js

Let’s take a glimpse at the functionality.

 

 

This functionality is not only easy to implement but will also save your time and efforts required to create one more component. After all, why complicate the program with a few more lines of code? 

Do try it out and let us know your thoughts on it!

Happy Coding! 🙂

About the Author



Piyush Singhal

Co-Founder, Director | HIC Global Soutions | Salesforce Consultant | AppExchange Strategist

An outcome-oriented technology leader with a global outlook, Piyush has over 8 years of experience in Project Execution, SDLC Planning, Salesforce, CRM, Salesforce Mobile, and Force.com. Piyush, a seasoned

Salesforce professional, started HIC Global Solutions in 2015 after filling senior development positions at front-running company names in the Salesforce development industry. He looks forward to challenging Salesforce development tasks, delivering novel apps for AppExchange listings, and forging global partnerships through working with the passionate people.


About the Author



Piyush Singhal

Co-Founder, Director | HIC Global Soutions | Salesforce Consultant | AppExchange Strategist

An outcome-oriented technology leader with a global outlook, Piyush has over 8 years of experience in Project Execution, SDLC Planning, Salesforce, CRM, Salesforce Mobile, and Force.com. Piyush, a

seasoned Salesforce professional, started HIC Global Solutions in 2015 after filling senior development positions at front-running company names in the Salesforce development industry. He looks forward to challenging Salesforce development tasks, delivering novel apps for AppExchange listings, and forging global partnerships through working with the passionate people.