Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to make PDF from React?

Tags:

reactjs

I am going to use jsPDF library in React.JS but it got error, please let me know if someone get my query. I was trying to this more than 2 days but I can't.

like image 832
Zhao.YM Avatar asked Oct 04 '16 09:10

Zhao.YM


People also ask

How do I export a table from React to PDF?

PDF export allows exporting pivot table data as PDF document. To enable PDF export in the pivot table, set the allowPdfExport as true. You need to use the pdfExport method for PDF exporting.


1 Answers

Step1:

Package.json dependencies

"jspdf": "git://github.com/MrRio/jsPDF/#76edb3387cda3d5292e212765134b06150030364",

This is due to jspdf for npm is not working.

Step2:

Add print function:

onPrint() {
    const { vehicleData } = this.props.parkedVehicle;
    const { 


    plate_no,
      max_time,
      entry_date_time,
      exit_date_time,
      expiry_time,
      address1,
      address2,
      city,
      state,
      zip,
      country,
      parking_status
    } = vehicleData;

    var pdfConverter = require('jspdf');
    //var converter = new pdfConverter();
    //var doc = converter.jsPDF('p', 'pt');

    var doc = new pdfConverter('p','pt','c6');

    doc.setFontSize(22);
    doc.text(20, 50, 'Park Entry Ticket');
    doc.setFontSize(16);
    doc.text(20, 80, 'Address1: ' + address1);
    doc.text(20, 100, 'Address2: ' + address2);
    doc.text(20, 120, 'Entry Date & time: ' + entry_date_time);
    doc.text(20, 140, 'Expiry date & time: ' + exit_date_time);
    doc.save("test.pdf");
}

And It worked fine to me.

like image 60
Angel Avatar answered Sep 29 '22 21:09

Angel