时间戳

首页 > 解决方案 > React-pdf - 点击按钮下载 pdf

reactjs - React-pdf - 点击按钮下载 pdf

问题描述

单击页面上的特定按钮时，我正在尝试生成和下载 PDF，重要的是单击按钮时我必须执行其他指令。

用于创建我正在使用的 PDFReact-pdf

我正在尝试，PDFDownloadLink但我找不到是否有办法在下载开始之前注入验证。

我的 PDF 看起来像这样

const MyDoc = () => (
    <Document>
        <Page>
            <View>
                <Text>Hello World!</Text>
            </View>
            <View>
                <Text>We're inside a PDF!</Text>
            </View>
        </Page>
    </Document>
);

并下载执行

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

但正如我所说，我想在下载开始之前执行操作，但我不需要干涉 pdf 内容

你有什么建议吗？

标签： reactjs

解决方案

我使用file-saver包创建了一个解决方法

我的按钮：

<button onClick={this.submitForm}>Send</button>

和submitForm方法：

submitForm = async (event) => {
    event.preventDefault(); // prevent page reload
    const blob = await pdf(
        <MyDoc />
    ).toBlob();

    saveAs(blob, 'wycena.pdf');
}

推荐阅读