如何使用jsPDF-AutoTable插件在PDF中自定義頁眉單元格？

Question

我試圖將HTML轉換爲pdf時遇到了奇怪的錯誤使用jsPDF-AutoTable插件。根據official Github page，可以通過使用createdHeaderCell和createdCell掛鉤來自定義任何headerCell和普通單元。我使用下面的代碼來更改特定標題和行單元格的樣式（Name標題和Jack單元格）。我也上傳這個代碼here。

$('#btn').click(function(){ 

      var columns = ['ID','Name','Address','Age']; 
      var rows = [ 
      [1,'John','Vilnius',22], 
      [2,'Jack','Riga',25] 
      ]; 

      var doc = new jsPDF('p', 'pt'); 

      doc.setFontSize(20); 
      doc.text(30, 30, 'Table'); 

      doc.autoTable(columns, rows, { 
       margin: { top: 50, left: 20, right: 20, bottom: 0 }, 
       createdHeaderCell: function (cell, data) { 
        if (cell.raw === 'Name') { 
         cell.styles.fontSize= 15; 
         cell.styles.textColor = 111; 
        } else {//else rule for drawHeaderCell hook 
         cell.styles.textColor = 255; 
         cell.styles.fontSize = 10; 

        } 
       }, 
        createdCell: function (cell, data) { 
        if (cell.raw === 'Jack') { 
         cell.styles.fontSize= 15; 
         cell.styles.textColor = 111; 
        } 
       } 
      }); 

      doc.save('output.pdf'); 
}); 

在這段代碼createdCell鉤按預期工作和風格Jack細胞，但沒有發生爲Name頭。我錯過了什麼，或者它是一個錯誤？發生下一Address頭

，我覺得用drawHeaderCell代替createdHeaderCell奇怪的解決方法，但在這種情況下，造型有趣的事情，而不是Name因爲我想。我的解決方法：我以前使用ID標題風格Name，但這種解決方案不是很漂亮，因爲我應該使用else規則進行造型，否則造型將適用於ID之後的所有標頭，而不僅僅是Name，所以我想了解一下我的初始代碼是錯誤的。

謝謝你的關注。

Answer 1

由於沒有人回答我使用我的解決方案解決方案使用drawHeaderCell掛鉤代碼如下。我在很多表上測試過它，它工作正常（在生產中，我使用動態生成的表具有不同的標題）。唯一的缺點是你不能改變第一個標題的顏色，但希望我不需要這樣做。

$('#btn').click(function(){ 

      var columns = ['ID','Name','Address','Age']; 
      var rows = [ 
      [1,'John','Vilnius',22], 
      [2,'Jack','Riga',25] 
      ]; 

      var doc = new jsPDF('p', 'pt'); 

      doc.setFontSize(20); 
      doc.text(30, 30, 'Table'); 

      doc.autoTable(columns, rows, { 
       margin: { top: 50, left: 20, right: 20, bottom: 0 }, 
       drawHeaderCell: function (cell, data) { 
        if (cell.raw === 'ID') {//paint.Name header red 
         cell.styles.fontSize= 15; 
         cell.styles.textColor = [255,0,0]; 
        } else { 
         cell.styles.textColor = 255; 
         cell.styles.fontSize = 10; 

        } 
       }, 
        createdCell: function (cell, data) { 
        if (cell.raw === 'Jack') { 
         cell.styles.fontSize= 15; 
         cell.styles.textColor = [255,0,0]; 
        } 
       } 
      }); 

      doc.save('output.pdf'); 
});