Handsontable, colWidths: 功能：如何设置适合内容的列宽？

Question

我的目标是将第一列的宽度设置为某个数字，而其他列的宽度保持不变。现在我知道设置

colWidths: [myValue]

实际上打破了其他列的宽度，但这似乎可以使用

解决

colWidths: function(index) {
    if(index == 0)
        return myValue;
    return ???
}

但我想知道我应该 return 代替 ??? 什么？ undefined 不起作用（好吧，它的工作方式与 colWidths: [myValue] 相同——每隔一列都获得相同的默认宽度）。我如何为此获得 "width by content" 值？

Answer 1

使用选项 manualColumnResize 而不是 colWidths 但与您的问题相同（仅定义第一列）：

manualColumnResize: [myValue]

第一列宽度将定义为您的值，其他列仍将是动态的。（因为 autoColumnSizeObject 默认设置为 true，当您使用 colWidths 选项).

您可以找到一个工作示例 here。

Answer 2

为了以防万一，我会 post 我发现的另一种方法（post编辑于 GitHub）：

使用 var autoColumnSize = handsontableInstance.getPlugin('autoColumnSize'); 和 autoColumnSize.calculateColumnsWidth(index, 0, true); – 这个计算列 index 在行 0 的必要宽度，使用 Math.max 是另一种选择。这是一个实现——没有遍历所有行并寻找最大值，而是一个原理证明：http://jsfiddle.net/7u1kxjLe/39/

Answer 3

我目前正在使用

modifyColWidth: function(width, col){
  if(width > 300) return 300;
}

按列号引用也可以。

modifyColWidth: function(width, col){
  if(col === 0) return 300;
}

编辑：实例化 HandsOnTable 后还需要这个，否则不能设置超过 300px 的宽度。

colWidths = [];
[...Array(hot.countCols()).keys()].map(i => {
  colWidths.push(hot.getColWidth(i));
});

hot.updateSettings({
  modifyColWidth: ()=>{},
  colWidths: colWidths
});

Handsontable, colWidths: 功能：如何设置适合内容的列宽？

Handsontable, colWidths: function: how to set a column width fitting content?

javascript

css

handsontable