function readOnly(count){ }
Sign Up ›
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
Learn More

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
Ajinkya Deshmukh 16Ajinkya Deshmukh 16 

Display lightning component data on vf page and render as PDF.

I have created the lightning component and want to display it on VF page and render as PDF. For this, I have created a Lightning Dependency App and added it to VF page using $Lightning.createComponent(String type, Object attributes, String locator, function callback). 
I have followed steps mentioned in the following documentation: https://developer.salesforce.com/docs/atlas.en-us.lightning.meta/lightning/components_visualforce.htm
But nothing is displayed in PDF.

Here is the code:
App: 
​<aura:application access="GLOBAL" extends="ltng:outApp">
    <aura:dependency resource="c:AccountSnapshotComponent"/>
</aura:application>

VF Page: 
<apex:page renderAs="pdf" standardStylesheets="false">
    <apex:includeLightning />
    <div id="lightning" />
    <script>
        $Lightning.use("c:AccountSnapshotApp", function() {
            $Lightning.createComponent("c:AccountSnapshotComponent",
                                       { label : "Press Me!" },
                                       "lightning",
                                       function(cmp) {
                                           // do some stuff
                                       });
        });
    
    </script>
</apex:page>

 Please help to display data in PDF format.
PrabhaPrabha
That is because the rendering happening first and then the component loading is happening later.
There is couple of things I would try:
1. Create a second VF page/ vf compoent where you just add the lightning component to it, and add that second page/ vf compoent to this page where you just include that second page/  vf compoent. I am not sure if that is gonna work, try and let us know.
1. This is little overdo, may not be straight answer to your question on how to include ltng comp to vf page, but If you want to have your page in lightning style, summer 18 has a new attribute to page that transforms the entire page into lightning : check this : https://releasenotes.docs.salesforce.com/en-us/summer18/release-notes/rn_vf_lightningstylesheets_ga.htm ;

HTH
Prabhanjan
Ajinkya Deshmukh 16Ajinkya Deshmukh 16
@prabha  If I remove renderAs="pdf" from VF page,  then lighting component data is displayed correctly on vf page. But I want page in PDF format. 
PrabhaPrabha
It will work. the only problem is that PDF is executed first. that is why you dont see it on the UI. try with the second page. 
Ashish Verma 76Ashish Verma 76
Were you able to find a solution to this problem? I have a visualforce page which is rendered as pdf. I have added a Lightning component to it but the component doesn't get displayed. When I remove the renderAs tag component is visible but the VF page is not displayed as pdf anymore.
Jake BackuesJake Backues
I was able to test using a VF Page using an Apex Component that hosts the Aura App/Cmp and this still did not render on the pdf, but after removing the RenderAs attribute from the page it shows up. This was the original suggested solution.

Seems we are not able to use Aura with a PDF page.
Harpinder Jot Singh 2Harpinder Jot Singh 2

Hi !!

Was anyone able to find a solution to this?