Jspdf v3 autotable colspan 功能不起作用

Question

我是 Angular 和 jspdf 的新手，所以请帮帮我。 我正在尝试使用 json 数据创建 pdf，并且我在 angular 6 中使用 jspdf 和 jspdf 自动表。我面临的问题是我无法将 colspan 应用于我的表头。我尝试了许多不同的代码，但没有运气。最后我使用了 jspdfautotable/example.js 的 github 上可用的代码，但标题仍然不符合预期。

以下是我提到的https://github.com/simonbengtsson/jsPDFAutoTable/blob/master/examples/examples.js

export(){
    // Col spans and row spans
    var doc = new jsPDF('p', 'pt');
    doc.setFontSize(12);
    doc.setTextColor(0);
    doc.setFontStyle('bold');
    doc.text('Rowspan and colspan', 40, 50);
    let body = this.bodyRows(15);
    for (var i = 0; i < body.length; i++) {
        var row = body[i];
        if (i % 5 === 0) {
        row['id'] = {rowSpan: 5, content: i / 5 + 1, styles: {valign: 'middle', halign: 'center'}};
        }
    }
    let head = [
    [
        {content: 'Data', colSpan: 5, styles: {halign: 'center', fillColor: [22, 160, 133]}},
    ],
        ['ID', 'Name', 'Email', 'City', 'Sum']
    ]
    doc.autoTable({
    startY: 60,
    head: head,
    body: body,
    theme: 'grid'
    });
    doc.save('TESTCOLSPAN.pdf');
    }

    bodyRows(rowCount) {
        rowCount = rowCount || 10;
        let body = [];
        for (var j = 1; j <= rowCount; j++) {
            body.push({
            id: j,
            name: 'PARTH',
            email: 'PARTH',
            city: 'PARTH',
            expenses: 'PARTH',
            });
        }
    return body;
}

输出pdf图片：

Answer 1

而不是

let head = [
    [
        {content: 'Data', colSpan: 5, styles: {halign: 'center', fillColor: [22, 160, 133]}},
    ],
        ['ID', 'Name', 'Email', 'City', 'Sum']
    ]

请试试这个，

let head = [

      {id:{content: 'Data', colSpan: 5, styles: {halign: 'center', fillColor: [22, 160, 133]}}},

      {id:'ID', name:'Name', email:'Email', city:'City', expenses:'Sum'}
]

对我有用

Output