如何在Sencha Architect中修改ExtJS 6.x数值、日期及布尔列的metaData？

我之前在做Sencha项目时也碰到过这个痛点：根据Sencha官方文档，numbercolumn、datecolumn和booleancolumn这几种列类型确实没有提供renderer事件。虽然从组件职责划分的逻辑来看，这类列本身已经自带格式化渲染的能力，不开放renderer事件似乎合理，但在实际业务场景中，这会导致我们无法灵活定制渲染样式，比如根据行数据动态修改单元格背景色这类需求就很难直接实现。

这里给你一个视图控制器中可用的渲染器函数示例，用来实现当记录的LineNum处于警告行号数组中时修改单元格背景色的需求：

renderCompanyID: function(value, metaData, record, rowIndex, colIndex, store, view) {
    // 假设warningLineNums是预先定义的警告行号数组
    const warningLineNums = [2, 5, 7];
    if (warningLineNums.includes(record.get('LineNum'))) {
        // 修改单元格背景色为警告黄
        metaData.style = 'background-color: #fff3cd;';
    }
    // 返回原始值或格式化后的值（如果是numbercolumn可额外做数值格式化）
    return value;
}

不过要注意，因为这类特殊列没有renderer事件，我们需要通过重写列的renderer方法来替代，或者在视图初始化时手动为列绑定自定义的渲染逻辑——比如在列的配置里直接指定renderer: 'renderCompanyID'（前提是这个函数在视图控制器的control配置中被正确关联），才能实现类似的定制效果。

内容的提问来源于stack exchange，提问作者aallord