Question

我正在尝试构建一个相当复杂的表格，并且我一直在使用免提的各种功能。

我希望实现的一件事是为单元格指定diff类以进行样式设计。所以我使用渲染器进行各种场景。事实上，当我将新类分配给单元格时，就像是第一次渲染它一样。

示例：

const cellClasses = (row, col, prop) => {
const cellProperties = {};
if (col === 2 || col === 8 || col === 15) {
    cellProperties.renderer = borderTest; // uses function directly
}
if ((row === 6 && col > 1) || (row === 12 && col > 1) || (row === 18 && col > 1)) {
    cellProperties.renderer = bgTest; // uses function directly
}
return cellProperties;

};

function bgTest(instance, td, row, col, prop, value, cellProperties) {
    Handsontable.renderers.TextRenderer.apply(this, arguments);
    td.className = 'testbg';
}

function borderTest(instance, td, row, col, prop, value, cellProperties) {
    Handsontable.renderers.TextRenderer.apply(this, arguments);
    td.className += 'testborder';
}

请不要太注意逻辑。我关注的是，如果一个单元碰巧满足这两个条件，那么它会将一个类添加到另一个类中。

一种愚蠢的方式是让我使用两种逻辑组合制作更大的IF，但随着我的网格变得越来越复杂，维护将更加困难。

所以，我的问题是，是否有一种简单的方法可以将多个类分配给单元格，而不是同时进行。

Answer 1

简短的说不，你不能按照你描述的方式分配类，因为Handsontable故意在每次迭代时重新渲染整个单元格。有充分的理由这样做，主要是为了减少状态错误。

使用更具体的逻辑来确定列所需的所有渲染器并不是一个坏主意，所以我认为合理（而不是hacky！）提出逻辑来声明性地定义列。您可能想要考虑使用col索引以外的其他东西来使代码更具可伸缩性。在我们的表中，我们倾向于将列定义存储在配置文件中或从我们的后端服务创建。希望有所帮助！

有没有办法使用渲染器方法添加多个类？

1 个答案: