Search code examples
reactjsreact-pdf

@react-pdf/renderer. How to generate PDF and download it

I managed to generate the pdf document and show it on the page but I am struggling to setup an option to download it.

It is possible to setup something like click here to download the document?

Please refer to the code below:

import React, {Component} from 'react';
import { PDFViewer } from '@react-pdf/renderer';
import FeeAcceptance from '../Pdfgenerator/FeeAcceptance'

class AcceptFees extends Component {

  render () {
      return (
          <>
              <PDFViewer>
                  <FeeAcceptance member_detail={'test'} />
              </PDFViewer >

              <h1>click<a href="?????"> here </a>to download the document</h1>
          </>
      );
  }
}

export default AcceptFees;

Thank you in advance.

Solution

  • In case you face the same problem, I found something that help. Replace PDFViewer for the code below:

    <PDFDownloadLink document={<FeeAcceptance />} fileName="fee_acceptance.pdf">
  {({ blob, url, loading, error }) => (loading ? 'Loading document...' : 'Download now!')}
</PDFDownloadLink>

    https://react-pdf.org/components