初始手动视图不会拉伸到正确的宽度

Question

我有一个handontable对象（实际上是两个对象，都在一个bootstrap模式中），在构建页面后加载了数据。这是一个重复问题的问题https://jsfiddle.net/mtbdeano/w7dofbyy/

即使给出stretchH: all选项，这些表的大小也太窄了。点击内容后，他们会像魔术一样调整到正确的列宽。我错过了一些初始化参数吗？如何在加载新数据后将其大小设置为正确的宽度？

  /* these tables are in the modal */
  $('#keyword_table').handsontable({
    data: keyword_data,
    rowHeaders: true,
    colHeaders: ['Keywords'],
    columnSorting: true,
    contextMenu: true,
    height: 256,
    stretchH: "last",
    enterBeginsEditing: false,
    minSpareRows: 1
  });

我使用此代码加载数据，该代码在成功的ajax调用时调用：

function load_table_from_ajax(tbl, data) {
  var $tbl = $(tbl);
  var hot = $tbl.handsontable('getInstance');
  // this formats my data appropriately
  var new_data = _.map(data, function (kw) {
    return new Array(kw);
  });
  hot.loadData(new_data);
  /* I have tried also doing a: hot.render(); */
}

根据教程，所有代码看起来都是正确的，知道为什么表格没有正确拉伸/调整大小？

在与Handsontable互动之前，它看起来像这样： 但点击标题或添加值后：

Answer 1

尝试colWidths:[100]

以像素为单位定义列宽。接受数字，字符串（将转换为数字）， 数组（如果要为每列单独定义列宽）或a function（如果要在每个渲染上动态设置列宽）。

Answer 2

尝试在初始化时提供width。由于您未设置它，stretchH可能无法进行所需的计算。我之前已经看到过这种行为并且设置它通常会修复它。