如何在Tabulator多工作表电子表格中添加列名

要给多标签（多工作表）的Tabulator表格设置列名，有两种常用实现方式：

1. 单个工作表单独定义列名 #

在每个工作表对象中添加columns数组，针对该工作表单独配置列标题、字段等属性：

var sheets = [
    {
      title:"First Sheet",
      key:"first",
      rows:20,
      // 为当前工作表添加列名配置
      columns:[
        {title:"列1", field:"col1"},
        {title:"列2", field:"col2"},
        {title:"列3", field:"col3"},
        {title:"列4", field:"col4"},
        {title:"列5", field:"col5"},
        {title:"列6", field:"col6"},
        {title:"列7", field:"col7"},
        {title:"列8", field:"col8"},
        {title:"列9", field:"col9"},
      ],
      data:[
        [9937,  "", "", 7749,   9816,   4355,   8279,   "", ""],
        [2380,  "", 6977,   8896,   4012,   3803,   5408,   3415,   3056],
        [9180,  "", 39, 9445,   3917,   "", 18, 5239,   2516],
        [1924,  8734,   1819,   1838,   2330,   7921,   9219,   "", 3537],
      ]
  },
  {
      title:"Second Sheet",
      key:"second",
      columns:[
        {title:"序号", field:"num"},
        {title:"数值A", field:"valA"},
        {title:"数值B", field:"valB"},
        {title:"数值C", field:"valC"},
        {title:"数值D", field:"valD"},
        {title:"数值E", field:"valE"},
        {title:"数值F", field:"valF"},
        {title:"数值G", field:"valG"},
        {title:"数值H", field:"valH"},
      ],
      data:[
        [2380,  "", 6977,   8896,   4012,   3803,   5408,   3415,   3056],
        [9180,  "", 39, 9445,   3917,   "", 18, 5239,   2516],
        [1924,  8734,   1819,   1838,   2330,   7921,   9219,   "", 3537],
        ["",    8665,   5875,   9732,   1926,   "", 9743,   8388,   ""],
        [7040,  4861,   2988,   5584,   2344,   9749,   8872,   9177,   6246],
        [6334,  1674,   2967,   "", 9353,   396,    6006,   8572 , ""],
        [6359,  "", 2580,   5723,   9801,   554,    1044,   5266,   8532],
      ]
  },
  {
      title:"Third Sheet",
      key:"third",
      rows:5,
      columns:[
        {title:"列A", field:"colA"},
        {title:"列B", field:"colB"},
        {title:"列C", field:"colC"},
        {title:"列D", field:"colD"},
        {title:"列E", field:"colE"},
        {title:"列F", field:"colF"},
        {title:"列G", field:"colG"},
        {title:"列H", field:"colH"},
        {title:"列I", field:"colI"},
      ],
      data:[
        [1924,  8734,   1819,   1838,   2330,   7921,   9219,   "", 3537],
        ["",    8665,   5875,   9732,   1926,   "", 9743,   8388,   ""],
        [7040,  4861,   2988,   5584,   2344,   9749,   8872,   9177,   6246],
        [6334,  1674,   2967,   "", 9353,   396,    6006,   8572 , ""],
        [6359,  "", 2580,   5723,   9801,   554,    1044,   5266,   8532],
        [7278,  6971,   2232,   5720,   5665,   7231,   1165,   "", 168],
      ]
  },
];
    
//Build Tabulator
var table = new Tabulator("#example-table", {
    height:"311px",

    spreadsheet:true,
    spreadsheetRows:10,
    spreadsheetColumns:10,
    spreadsheetColumnDefinition:{editor:"input"},
    spreadsheetSheets:sheets,
    spreadsheetSheetTabs:true,

    rowHeader:{field:"_id", hozAlign:"center", headerSort:false, frozen:true},

    editorEmptyValue:undefined, // 确保空值设为undefined，避免在输出数据中冗余
});

2. 所有工作表统一使用相同列名 #

如果所有工作表的列结构一致，可以直接在表格初始化配置中添加columns数组，无需在每个工作表中单独定义：

//Build Tabulator
var table = new Tabulator("#example-table", {
    height:"311px",

    spreadsheet:true,
    spreadsheetRows:10,
    spreadsheetColumns:10,
    spreadsheetColumnDefinition:{editor:"input"},
    spreadsheetSheets:sheets,
    spreadsheetSheetTabs:true,

    // 统一设置所有工作表的列名
    columns:[
        {title:"通用列1", field:"col1"},
        {title:"通用列2", field:"col2"},
        {title:"通用列3", field:"col3"},
        {title:"通用列4", field:"col4"},
        {title:"通用列5", field:"col5"},
        {title:"通用列6", field:"col6"},
        {title:"通用列7", field:"col7"},
        {title:"通用列8", field:"col8"},
        {title:"通用列9", field:"col9"},
    ],

    rowHeader:{field:"_id", hozAlign:"center", headerSort:false, frozen:true},

    editorEmptyValue:undefined, // 确保空值设为undefined，避免在输出数据中冗余
});

关键说明 #

• columns数组中的每个对象，title是列显示的标题，field是对应数据的字段标识（需和data数组中的列位置一一对应）。
• 如果工作表中单独定义了columns，会优先使用该工作表的列配置，覆盖全局的columns设置。

内容的提问来源于stack exchange，提问作者user2976237