未捕获的引用错误: jsPDF在版本2.3.0和普通JS中未定义。

Question

未捕获的引用错误: jsPDF在版本2.3.0和普通JS中未定义。

3

我需要从一个表格生成一份PDF报告，我正在使用jsPDF和jsPDF-autotable。我知道使用jsPDF生成PDF文件非常简单，我相信我遵循了jsPDF文档页面上提到的确切步骤，但至今没有成功。我还查阅了许多类似的问题，但没有一个对我有效。

以下是我如何在html head标签中导入jsPDF和jsPDF-autotable：

<!-- Js PDF -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/2.3.0/jspdf.umd.min.js"></script>
<!-- Js PDF Auto Table -->
<script src="https://cdn.jsdelivr.net/npm/jspdf-autotable@3/dist/jspdf.plugin.autotable.min.js"></script>

这是我用于按钮的HTML代码，该按钮将触发JavaScript函数：

<div class="col text-end">
        <button type="button" class="btn btn-secondary" id="btnGenerateReport" onclick="prepareReport()">
            Generate Report
        </button>
</div>

这里是一个 JavaScript 函数，它应该根据表格生成一个 PDF 文件：

function prepareReport() {
    var doc = new jsPDF();
    doc.autoTable({ html: '#reportTable' });
    doc.save(stationSelected + '_' + dateSelected + '.pdf');
}

以下是我遇到的控制台错误：

reports.js:180 Uncaught ReferenceError: jsPDF is not defined
at prepareReport (reports.js:180)
at HTMLButtonElement.onclick (reports:213)

我非常感谢你能提供的所有帮助。谢谢。

- Sujal Patel

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- tmilar · Accepted Answer

问题出在你的函数中：

function prepareReport() {
    var doc = new jsPDF();
    doc.autoTable({ html: '#reportTable' });
    doc.save(stationSelected + '_' + dateSelected + '.pdf');
}

使用 script 标签导入此模块，就像您正在做的那样，在查看 jsPDF 项目仓库后，将全局变量导出为 jspdf，而不是 jsPDF。

因此，正确的工作版本应该是：

function prepareReport() {
    var doc = new jspdf.jsPDF();
    doc.autoTable({ html: '#reportTable' });
    doc.save(stationSelected + '_' + dateSelected + '.pdf');
}

请注意，仅有这段代码是不够的，因为stationSelected和dateSelected没有定义。您还应该提供这些值的定义。

实时codepen工作示例。