Javascript 为什么设置hiddenColumns和colWidths时，我的可手持自定义单元格渲染器仅适用于第一行？

我配置了以下handsontable：

var container = document.getElementById('example1'),
    hot;

var data = [];

for (var i = 0; i < 100; i++) {
 data.push({"id": 1, "rgba": "204,255,204,1"});
}

function callback (row, column, prop) {
  const cellProperties = {};
  cellProperties.renderer = renderer;
  return cellProperties;
}

function renderer (instance, td, row, col, prop, value, cellProperties) {
  Handsontable.renderers.TextRenderer.apply(this, arguments);
  var rdata = instance.getSourceDataAtRow(row);
  var colour = rdata.rgba;
  td.style.backgroundColor = 'rgba(' + colour + ')';
}

hot = new Handsontable(container, {
  data: data
  , cells: callback

  // adding either of these in isolation allows the rendering to continue working. However adding both together causes only the top row to render correctly.
  , hiddenColumns: true
  , colWidths: 150
});  

var container=document.getElementById（'example1'），
热的；
var数据=[]；
对于（变量i=0；i<100；i++）{
push（{“id”：1，“rgba”：“204255204,1”}）；
}
函数回调（行、列、属性）{
const cellProperties={}；
cellProperties.renderer=渲染器；
归还财产；
}
函数渲染器（实例、td、行、列、属性、值、单元格属性）{
Handsontable.renderers.textrender.apply（这是参数）；
var rdata=instance.getSourceDataAtRow（行）；
var color=rdata.rgba；
td.style.backgroundColor='rgba（'+color+'）；
}
hot=新的可手持设备（容器、{
数据：数据
，单元格：回调
//单独添加这两个选项中的任何一个都可以使渲染继续工作。但是，同时添加这两个选项只会导致顶行正确渲染。
，hiddenColumns:true
，冷宽：150
});  

通过以下链接中提供的运行示例：

我遇到的问题是，我的自定义渲染器设计用于根据rgba列中的值设置每个可手持设备行的背景颜色。一开始效果不错

但是，当同时引入hiddenColumns:true和coldwiths:150（或任意数量）属性时，会导致一个问题，即只有handsontable的顶行才能正确渲染

但是单独添加这两个属性都可以使渲染正常工作

那么，有人知道为什么会发生这种情况以及如何解决它吗

注意

虽然只调用hot.render（）就解决了这个问题，但这并不是一个真正的解决方案，因为这会导致额外的不必要的handsontable呈现，这在较大的表中会造成巨大的性能开销