如何使用基于单个单元格值的 jsPDF AutoTable 为行着色？答案

【问题标题】：How can I color a row using jsPDF AutoTable based on a single cell value?如何使用基于单个单元格值的 jsPDF AutoTable 为行着色？
【发布时间】：2020-01-24 19:40:34
【问题描述】：

我正在尝试使用 jsPDF + AutoTable 基于交互式/动态表创建 PDF。一行中的最后一个单元格将显示“是”或“否” - 如果单元格显示“是”，则应突出显示整行。

我最接近的是让单元格突出显示，但我需要整行突出显示。我似乎无法将单元格绑定到行索引。

这是我目前的代码：

willDrawCell: function (data) {
   if (data.cell.text == "Yes") {
      doc.setFillColor(67, 160, 71);
   }
}

感谢您的帮助。

【问题讨论】：

标签： jspdf jspdf-autotable

【解决方案1】：

我能够解决这个问题！

在调用 doc.autoTable() 之前，我计算“是”所在的索引，并将这些值存储在一个数组中。然后，我会根据需要遍历每个行索引和 setFillColor。这是我的代码现在的样子：

willDrawCell: function (data) {
  if (data.cell.text == "Yes") {
   doc.setFillColor(67, 160, 71);
  }
   for (let i = 0; i < ready_rows.length; i++) {
        if (data.row.index === ready_rows[i]) {
             doc.setFillColor(239, 154, 154);
           }
    }
}

【讨论】：

【解决方案2】：

这里 currentRow 是自动表中给出的行

                 
    var res1 = doc.autoTableHtmlToJson(document.getElementById(m));
        var idmm=document.getElementById(n);
              
                var clength=res1.columns.length;
                 var crow=res1.rows.length;
        
         doc.autoTable(res1.columns, res1.data, {margin: {top: vy+25},pageBreak: 'auto',styles: {cellPadding: 1.5,fontSize:fsize , },fontStyle: 'bold',drawRow: function (row, data) {
                currentRow1 = row;
                        currentRow1.height =30;
                      
                     
 if((currentRow1.cells[0].text[0].includes('Total')) || (currentRow1.cells[0].text[0].includes('Avg'))||(currentRow1.cells[0].text[0].includes('count'))||(currentRow1.cells[0].text[0].includes('Min'))||(currentRow1.cells[0].text[0].includes('Max')))

  {
                    1
                         for(var i=0;i<res1.columns.length;i++)
                              {
                              
                                  currentRow1.cells[i].styles.fontStyle = "bold";
                                  currentRow1.cells[i].styles.font = "sans-serif" ; 
                                  currentRow1.cells[i].styles.fillColor = [243,205,204];                 
                                  currentRow1.cells[1].styles.columnWidth="wrap";
                                  currentRow1.cells[1].styles.FontSize=30;
                                  
                                  }
                                 
                               
                                  
  }                    
        
                
    },columnStyles: {0: {columnWidth: columnwidthrgroup},},});

    ```

【讨论】：