如何在使用 react-pdf 库创建的 react 中保存 pdf？

Question

我正在创建一个 React 应用程序，我必须在其中生成 pdf 并在单击按钮时保存该 pdf。如何将此 pdf 保存到我的本地目录？

CreatePdf.js

import React, { Component } from 'react';
import { Document, Page, Text, View, StyleSheet, Image } from '@react-pdf/renderer';

class CreatePdf extends Component {
    constructor() {
        super();
        this.state = {
            styles: {} // all styles here
        }
    }

MyDocument = () => (
        <Document>
            <Page style={this.state.styles.body}>
                <Text style={this.state.styles.header} fixed>
                    ~ Created with react-pdf ~
                </Text>
            </Page>
        </Document>

    render() {
        return (
            <button onClick={(this.MyDocument, `${__dirname}/example.pdf`)}>Print PDF</button>
        )
    }
}
export default CreatePdf;

App.js

render() {
    return (
         <MyDocument />
    )
}

至于现在，当我点击按钮时，没有任何反应。就像在 jsPDF 中一样，我们有 .save() 同样我们如何保存这个 pdf？

Answer 1

您可以使用 PdfDownLoadLink 打包您的文档以下载 link

import { PDFDownloadLink} from '@react-pdf/renderer';


<PDFDownloadLink document={<MyDocument />} fileName={"FileName"}> 

       <button> Download </button> 

</PDFDownloadLink>

如何在使用 react-pdf 库创建的 react 中保存 pdf？

How to save pdf in react created using react-pdf library?

javascript

reactjs

react-pdf