javascript - ExtJS RowExpander 插件奇怪的 colspan

Question

尝试使用行扩展器制作网格并遇到奇怪的行为。

第一行的展开 View 的 colspan 为 3(表中的列数)，第二行的 colspan 为 2，后续行的 colspan 为 1。

有人可以解释为什么会发生这种情况，以及指定扩展行的内容应填充所有内容的方法(colspan 设置为表中的列数)。

JSFiddle:

JSFiddle working example

代码:

Ext.onReady(function(){
var store = Ext.create('Ext.data.Store',{
    fields: ['id','name','ship'],
    data: [{
        id: 1, 
        name: 'Kirk',
        ship: 'Enterprise'           
    },{
        id: 2,
        name: 'Picard',
        ship: 'Enterprise'
    },{
        id: 3,
        name: 'Janeway',
        ship: 'Voyager'
    },{
        id: 4,
        name: 'Khan',
        ship: 'Reliant'
    }]
});

Ext.create('Ext.grid.Panel',{
    title: 'Test',
    renderTo: Ext.getBody(),
    store: store,
    columns: [{
        text: 'ID',
        dataIndex: 'id'
    },{
        text: 'Name',
        dataIndex: 'name'
    },{
        text: 'Ship',
        dataIndex: 'ship'
    }],
    plugins: [{
        ptype: 'rowexpander',
        rowBodyTpl: [
            '<div class="row-details-panel" id="row-details-panel-{id}">{id} = {name}</div>'
        ]
    }],
    listeners: {
        afterrender: function (grid) {
            // hide the first row generated by rowExander plugin
            grid.getView().getHeaderAtIndex(0).hide();
        }
    }
});

});

Answer 1

这很可能是Ext 4.2.0版本的错误。我已经在 https://fiddle.sencha.com 运行了你的代码与 Ext 4.2.1 相比，它的行为符合预期 - colspan 始终为 3。

升级到4.2.1，应该没什么大不了的。