Почему мой рендерер пользовательских ячеек Handsontable работает только для первой строки, когда установлены hiddenColumns и colWidths? - PullRequest
0 голосов
/ 23 января 2020

У меня настроена следующая конфигурация 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
});  

С работающим примером, приведенным по следующей ссылке: https://jsfiddle.net/JoshAdams/sgLm5ev2/

Проблема, с которой я сталкиваюсь, Мой пользовательский рендерер предназначен для установки цветов фона каждой строки, определяемой вручную, на основе значения в столбце rgba. Первоначально это работает нормально.

Однако, когда введены оба свойства hiddenColumns: true и colWidths: 150 (или любое число), это вызывает проблему, из-за которой только верхний ряд handsontable будет отображаться правильно.

Но добавление любого из этих свойств в отдельности позволяет правильно отображать данные.

Так кто-нибудь знает, почему это происходит и как это исправить?

Примечание

Хотя простой вызов hot.render () решает проблему, на самом деле это не решение, так как это приводит к дополнительным ненужным визуализациям рабочих столов, что приводит к значительному снижению производительности в больших таблицах.

...