Question

我使用了jspdf-autotable，并且以前可以正常工作。但是我不知道为什么，一个月后突然不起作用。以前，在didParseCell HookData中，我正在获取tdElement的值。但是现在我没有任何价值。 HookData的配置在新版本中是否已更改？这是我的代码-

app.component.ts

capture() {

    var doc = new jspdf('l', 'pt', 'a4');

    var cols = [{ title: 'Id', dataKey: 'id' },
    { title: 'Source-Field Resolved Path', dataKey: 'sourceName' }, { title: 'Source Field Technical Name', dataKey: 'sfieldName' },
    { title: 'Source Data Type', dataKey: 'sdataType' }, { title: 'Target Field Resolved Path', dataKey: 'targetName' },
    { title: 'Target Field Technical Name', dataKey: 'tfieldName' }, { title: 'Target Data Type', dataKey: 'tdataType' }, { title: 'Condition', dataKey: 'urgencyName' },
    { title: 'Description', dataKey: 'descriptionName' }, { title: 'Source Field Row No.', dataKey: 'directRowNo' },
    { title: 'Source Field Path', dataKey: 'sourceFieldPath' }, { title: 'Source Field Name', dataKey: 'sourceFieldName' },
    { title: 'Data Type Verified', dataKey: 'datatypeVerified' }]

    var tableData = [];
    for (var i = 0; i < this.responseData.length; i++) {
      tableData.push({
        'id': this.responseData[i].id, 'sourceName': this.responseData[i].sourceName, 'sfieldName': this.responseData[i].sfieldName, 'sdataType': this.responseData[i].sdataType,
        'targetName': this.responseData[i].targetName, 'tfieldName': this.responseData[i].tfieldName, 'tdataType': this.responseData[i].tdataType, 'urgencyName': this.responseData[i].urgencyName,
        'descriptionName': this.responseData[i].descriptionName, 'directRowNo': this.responseData[i].directRowNo, 'sourceFieldPath': this.responseData[i].sourceFieldPath,
        'sourceFieldName': this.responseData[i].sourceFieldName, 'datatypeVerified': this.responseData[i].datatypeVerified, 'backgroundColor': this.responseData[i].backgroundColor
      })
    }
    doc.autoTable(cols, tableData, {


        didParseCell: function (HookData ){


        console.log("HookData = ", HookData)


        var tdElement;


        tdElement = HookData.row.raw.backgroundColor
          ;
        console.log("tdElement = ", tdElement)
        if (tdElement == false && HookData.column.raw.dataKey == "datatypeVerified") {

          HookData.cell.styles.fontStyle = 'bold';
          HookData.cell.styles.textColor = [255, 0, 0]
        }


      }

    })


    document.getElementById('obj').dataset.data = 
    doc.output("datauristring");


    var blob = doc.output("blob");
    window.open(URL.createObjectURL(blob));

  }

app.component.html

<button class="btn btn-default" style="margin-left:30px" (click) = "capture()" id="capture" >Capture</button>

<object id="obj"  [attr.data]  type="application/pdf"> </object>

Answer 1

您正在使用javascript中的列和行初始化自动表。因此，autoTable未连接到任何html表。当使用html选项初始化autoTable时，钩子数据（hookData.row.raw）的raw属性只是tr元素的一个实例。

现在验证了hookData.row.raw是最新版本的tr元素的实例，

doc.autoTable({html: '.table', didDrawCell: data => {
    console.log(data.row.raw) // Instance of <tr> element
}});

jspdf-autotable-didParseCell无法正常工作

1 个答案: