我正在尝试添加加载动画,以便用户在选择导出pdf时可以看到它正在加载(我正在使用jspdf)。我打开了在下面的Promise中导出pdf的函数,并在其下面的函数中使用钩子调用了它,以将加载动画设置为。,然后将其关闭。我看到的是按钮冻结,没有加载动画发生,几秒钟后它下载了文件。我不确定自己在做什么错,我真的没有诺言。
exportToPdf: function (filename, rows, columns, download) {
return new Promise((resolve,reject) => {
var headers = this.generateHeaders(columns);
//
var rowData = this.generateRows(columns, rows);
var doc = new jsPDF({
putOnlyUsedFonts: true,
orientation: 'landscape',
format: 'letter'
});
var totalPagesExp = "{total_pages_count_string}";
var pageContent = function (data) {
// HEADER
let logo = null;
var img = new Image;
img.crossOrigin = "";
img.src = image;
doc.addImage(img, 'PNG', 3, 3, 10, 10);
doc.text(filename, data.settings.margin.left + 20, 10, {align: 'center'});
// FOOTER
var str = "Page " + data.pageCount;
// Total page number plugin only available in jspdf v1.0+
if (typeof doc.putTotalPages === 'function') {
str = str + " of " + totalPagesExp;
}
doc.setFontSize(10);
doc.text(str, data.settings.margin.left, doc.internal.pageSize.height - 10);
};
doc.autoTable({
head: [headers], body: rowData, theme: 'grid', didDrawPage: pageContent,
headStyles: {fillColor: 100, fontSize: 10}, columnStyles: {halign: 'center'}
});
doc.putTotalPages(totalPagesExp);
if (download) {
// resolve(doc);
doc.save(date + this.formatTitle(filename) + '.pdf');
resolve('resolved');
} else {
doc.output('blob', date + this.formatTitle(filename) + '.pdf');
}
})
}
const convertToPdf = (boolean) => {
setLoading(true);
ExportData.exportToPdf(tableTitle, rows, columns, boolean).then(result=>{
setLoading(false);
});
}