tree - 如何使用具有树扩展的 dgrid 执行 renderRow 方法的aspect.after？

Question

我正在尝试使用带有树扩展的 dgrid 来设置行样式。为此，我按照https://github.com/SitePen/dgrid/issues/380中的建议使用aspect.after如果您不使用树扩展，它效果很好。

但是使用 Tree 扩展，网格会在构造函数完成时呈现，因此aspect.after 不起作用。

我的代码是:

require([
    'dojo/_base/declare',
    'dgrid/OnDemandGrid',
    'dgrid/Tree',
    'dgrid/Keyboard',
    'dgrid/Selection',
    'dstore/Memory',
    'dojo/aspect',
    'dstore/Tree',
    'dgrid/extensions/ColumnResizer',
    'dojo/domReady!'
], function (declare,OnDemandGrid, tree, Keyboard, Selection, Memory,aspect,TreeStore,ColumnResizer)  {

var dataStore = new (declare([ Memory, TreeStore ]))({ data: $jsonData });

var CustomGrid = declare([ OnDemandGrid, tree, Keyboard, Selection, ColumnResizer ]);

var columns = $jsonHeadTitles;
columns[0][0] = tree(columns[0][0]);

var grid = new CustomGrid({
        className: 'dgrid-autoheight',
        collection: dataStore.filter( { parent: 0 }),
        columns: columns,
        noDataMessage: 'Sin registros',
        shouldExpand: function(){ return true; },
        selectionMode: 'single',
        cellNavigation: false,
        formatterScope: { html: function(item){ return item; }}

}, '$nombre');

aspect.after(grid, 'renderRow', function(row, args) {
    var object = args[0];
    if (!empty(object.parent)) {
        row.className += ' gridchildren';
    }
    return row;
});

 grid.on('dgrid-error', function(event) {
    console.error(event.error.message);
});

});

我们如何使用树扩展来设置行样式？

问候，

Answer 1

您的问题与 Tree mixin 的使用没有直接关系；事实上，如果在第一次渲染时没有它，您也会遇到同样的问题，因为在这种情况下，在初始渲染运行后， aspect.after 被连接起来(因为网格立即启动并且存储正在使用是同步的)。

有几个选项可以解决这个问题。

一种选择是最初将 collection 设置为 null，然后仅在调用 aspect.after 后将其设置为您的实际存储。

另一种方法是不将网格绑定(bind)到文档流中已有的元素，在这种情况下，除非您手动调用grid.startup，否则初始渲染不会发生，从而使您有机会调用aspect.after 事先。

或者，您可以将逻辑放入用于将功能混合到网格中的 declare 调用中，而不是在创建实例后使用 aspect。例如:

var Grid = declare([ OnDemandGrid, Tree, Keyboard, Selection, ColumnResizer ], {
    renderRow: function (object) {
        var rowElement = this.inherited(arguments);
        if (!empty(object.parent)) {
            rowElement.className += ' gridchildren';
        }
        return rowElement;
    }
});

还值得注意的是:在 dgrid 0.4 中，将列传递给 tree (正如您在创建网格之前所做的那样)是不正确的。 Tree 现在是一个 mixin(您已经在 declare 调用中正确使用了它)。