Activity › Forums › Salesforce® Discussions › How can we use a Lightning Component in a Salesforce Visualforce Page? Explain?

Tagged: , , , ,

  • Manpreet

    Member
    May 1, 2018 at 10:48 am

    Hi pranav,

    A Lightning component can be embed in any webpage using a very powerful and flexible feature, Lighting out. When used with Visualforce some complexity becomes simpler.
    Lightning component can be added to Visualforce page in three steps:

    1. We have to first Add the Lightning Components for Visualforce JavaScript library to your targetted Visualforce page using the tag.

    2. Next we have to create and refer a Lightning app which is used to the component dependencies.

    3. Lastly we need to write a JavaScript function which will finally create the the component on the page using $Lightning.createComponent()

    Thanks.

  • Aman

    Member
    May 1, 2018 at 10:50 am

    Hi Pranav,

    You can use the following script :

    <script>
    var accountId = "{!$CurrentPage.parameters.id}";
    console.log('::::'+accountId);
    $Lightning.use("TRACT_SF:accountDetailApp", function() {
    $Lightning.createComponent(
    "TRACT_SF:accountDetail_LT",
    { "accountId" : accountId },
    "vf-app",
    function(cmp) {
    $("#test").hide()
    console.log("Component created!");
    console.log(cmp);
    });
    });
    </script>

    Thanks

Log In to reply.

Popular Salesforce Blogs

Popular Salesforce Videos

Report

Harassment or bullying behavior
Harassment or bullying behavior
Contains mature or sensitive content
Contains misleading or false information
Mobile App Reported Contents
Contains abusive or derogatory content
Contains spam, fake content or potential malware

Block Member?

Please confirm you want to block this member.

You will no longer be able to:

  • See blocked member's posts
  • Mention this member in posts
  • Invite this member to groups
  • Message this member
  • Add this member as a connection

Please note: This action will also remove this member from your connections and send a report to the site admin. Please allow a few minutes for this process to complete.

Report

You have already reported this .