Extjs在网格面板中渲染后如何获取指定元素

Question

嗨，我知道这个问题的标题有点模糊。

我有一个网格列，想要实现数据评级。 我使用renderer并返回div，但现在我不知道要获取元素。

我的代码如下

{
    text: 'rank',
    dataIndex: 'rank',
    flex: 1,
    tdCls: 'column-rank',
    renderer: function(value) {
        return '<div class=rating>' +
                    '<div data-rating="1"></div>' +
                    '<div data-rating="2"></div>' +
                    '<div data-rating="3"></div>' +
                    '<div data-rating="4"></div>' +
                    '<div data-rating="5"></div>' +
                '</div>'
    }
}

Answer 1

我想您必须看看CD提及的评级小部件 。

如果您仍然想自己实现评级，我想您必须为其编写自定义组件，使用来自网格存储的评级数据并引用renderer的特定行对其进行设置。

如果仍然想使用div自己实现评级，则可以执行以下操作来选择data-rating div：

Ext.query('div[data-rating="5"]', myRowComponent.getEl());

Answer 2

渲染器函数在调用时会传递几个参数。 如文档中所述，其中之一是记录。 您可以使用此参数来提取当前行的记录。 您可以像访问模型字段record.get（'fieldName'）一样访问记录字段。 伪代码示例：

 renderer: function(value, metaData, record, rowIndex, colIndex) { var fieldValue1 = record.get('fieldName1'); return '<div class=rating>' + '<div data-rating="1">' + fieldValue1 + '</div>' + ... '</div>'; }