Reading the url param through a lightning web component(Using LWC Components in Visualforce Pages).

URL: https://sampleDEV/apex/Enrollment?enrollmentId=a082w000000YUQEfd

Visualforce Page:

 <apex:page >
<apex:includeLightning />
<div id="lightning" /> 

var enrollId = "{!$CurrentPage.parameters.enrollmentId}";
$Lightning.use("c:EnrollmentVf", function() {  //Aura app name
                               {EnrId : enrollId},
                               function(cmp) {
                                   // console.log("button was created" + enrollId);
                                   // do some stuff

Aura app:

<aura:application  access="GLOBAL" extends="ltng:outApp" >  
<aura:dependency resource="enrollment_5"/>


export default class Enrollment_5 extends LightningElement {
 @api EnrId;
// @api recordId = "a082w000000YUQEfd";
 @api recordId = this.EnrId;

 @wire(getParentdetails, { enrollmentName: "$recordId" })
 getContacts(response) {
  console.log("URL Param  ==>" + this.EnrId);

When i print this this.EnrId value is getting URL Param ==>undefined

1 Answer 1


When the class is first defined, EnrId is undefined.

This is when you are assigning it to recordId - which fires getParentDetails.

Which means, that your console.log will print out undefined.

Your options to fix include: pass recordId in directly:

                           {recordId : enrollId},

Or use a setter function so that when EnrId is set, it sets recordId (bad because it has a side effect).

set EnrId(value){
    this._EnrId = value
    this.recordId = value;

Or perhaps assign EnrId to recordId in the connectedCallback() //I am unsure about this one, as I don't know when exactly this gets called.

       this.recordId = this.EnrId;
  • Thanks Caspar, It's Working now. Your're Awesome. :) Mar 17, 2020 at 6:11
  • No worries! Which technique did you use? Mar 17, 2020 at 6:15
  • The First one pass recordId Mar 17, 2020 at 6:20

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .