制表符 - 字体大小更改时调整列标题大小

Question

我正在使用Tabulator 和默认的“fitData”函数来调整单元格的大小。当我 a) 设置默认字体大小和 b) 使用 rowFormatter 更改行字体大小时，这完全符合预期：

        rowFormatter:function(row){
        var rowData = row.getData();
        row.getElement().style.fontSize = config.body_font_size + "px";

但是，当我想更改列标题的字体大小时，上述方法有效：

var curHeaders = document.getElementsByClassName("tabulator-col");
for (var i = 0; i < curHeaders.length; i++) {
    curHeaders[i].style.fontSize = fontSize.toString() + "px";
}

这会更改所有列的字体大小，但不会适当地调整列宽。是否有不同的类我应该分配字体？有没有办法以类似于 rowFormatter 的方式应用它？

Answer 1

您不应该尝试从表格外部以编程方式更改 Tabulator 内部的元素。由于 Tabulator 使用虚拟 DOM，这些更改可以随时覆盖，恕不另行通知。

如果您需要格式化列标题标题，您应该在要更改的列的列定义中使用 titleFormatter：

//define custom formatter
var customFormatter = function(cell, formatterParams, onRendered){

    //set font size
    cell.getElement().style.fontSize = fontSize.toString() + "px";

    return cell.getValue();
}

//in the column definition for a column
{title:"Name", field:"name", titleFormatter:customFormatter },

关于如何使用格式化程序的完整文档可以在这里找到：http://tabulator.info/docs/4.0/format

如果您需要继续使用您的方法，那么您可以调用表格 redraw 函数来强制重建表格：

table.redraw(true);

您是否有理由需要在运行时对其进行更改，而不仅仅是在 CSS 中进行更改？