使用 datatables.net 导出为 pdf 时设置列宽

Question

嗨，我有这张表，我想导出，但是当内容很短时，一列的宽度太长了导出时，这是我的代码

$(document).ready(function() {
    var currentDate = new Date()
    var day = currentDate.getDate()
    var month = currentDate.getMonth() + 1
    var year = currentDate.getFullYear()

    var d = day + "-" + month + "-" + year;
    $('#detailTable').DataTable({
        dom: 'Bfrtip',
        buttons: [{
            extend: 'excelHtml5',
            title: d + ' Purchase Orders'
        }, {
            extend: 'csvHtml5',
            title: d + ' Purchase Orders'
        }, {
            extend: 'pdfHtml5',
            title: d + ' Purchase Orders',
            orientation: 'landscape',
            pageSize: 'LEGAL',
            exportOptions: {
                columns: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12]
            }
        }]
    });
});

有没有办法可以设置特定列的宽度？提前谢谢

Answer 1

您可以使用 customize 回调来更改 PDFmakes 的“样式字典”。如果您想强制 #2 列的宽度为 100px 或最大 100px，请执行以下操作：

{
  extend: 'pdfHtml5',
  title: d + ' Purchase Orders',
  orientation: 'landscape',
  pageSize: 'LEGAL',
  exportOptions: {
     columns: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12]
  },
  //-------------------------- 
  customize : function(doc) {
     doc.styles['td:nth-child(2)'] = { 
       width: '100px',
       'max-width': '100px'
     }
  }
}

这将通过 CSS 样式规则

td:nth-child(2) {
  width: 100px;
  max-width: 100px;
}

到 PDFmake。请参阅文档 -> http://pdfmake.org/#/gettingstarted 转到“样式字典”部分