制表符 fitData 布局未调整表格宽度答案

【问题标题】：Tabulator fitData layout not resizing width of table制表符 fitData 布局未调整表格宽度
【发布时间】：2020-06-14 19:06:11
【问题描述】：

我正在尝试将 Tabulator v4.6.3 与 fitData 布局一起使用。这是我的代码：

var table = new Tabulator("#cowTable", {
        data: cowTableData,
        layout: "fitData",
        history: true,
        columns: [
            { title: "Cow ID", field: "cowId", editor: "number", editorParams: { step: 1 } },
            { title: "Enter", field: "enter", editor: "number", editorParams: { step: 100 } },
            { title: "Exit", field: "exit", editor: "number", editorParams: { step: 100 } },
            { title: "Strip Status", field: "strip", editor: "select", editorParams: { "active": "Active", "inactive": "Inactive", "absent": "Absent" } },
            { title: "Mobility", field: "mobility", editor: "number", editorParams: { min: 0, max: 3, step: 0.05 } },
            { title: "Body Condition", field: "bodycond", editor: "number", editorParams: { min: 0, max: 4, step: 0.05 } }
        ]

产生这个：我的问题是右侧的黑色部分似乎表格没有正确调整大小。每当我使用布局选项 fitColumns 时，它都可以正常工作，并且是下图的全宽，但列太宽了。我尝试在表格代码下方执行 table.redraw() ，但这并不能解决任何问题。如果有人有关于如何删除右侧黑色部分的解决方案，将不胜感激。

谢谢。

【问题讨论】：

标签： javascript html tabulator

【解决方案1】：

这是正确渲染。

在 fitData 布局模式下，列会调整大小以适合其数据/列标题，这正是那里发生的情况，右侧的空闲空间为空。

如果您想填充空白区域，那么您应该使用 fitDataFill 或 fitDataStretch 布局模式.

Taubulator 网站在Layout Examples Section 中提供了每种布局模式的示例

【讨论】：