gridview - 使用 CheckboxModel 的多个网格

Question

我已经定义了 xtype，它是具有 2 列和 selModel 的简单网格：Ext.selection.CheckboxModel。

Ext.define('MySimpleType',
{
    extend: 'Ext.grid.Panel',
    alias: 'widget.MySimpleXType',
    autoScroll: true,
    store: mySimpleStore,
    selModel: Ext.create("Ext.selection.CheckboxModel", {
        checkOnly : true
    }),
    border: false,
    columns: [
        {
            header: 'Code',
            flex: 1,
            sortable: true,
            dataIndex: 'Code'
        },
        {
            header: 'Name',
            flex: 1,
            width: 80,
            sortable: true,
            dataIndex: 'Name'
        }
    ]
});

当我尝试在一个面板中多次使用此 xtype 时：每个 xtype 都使用已创建的 CheckboxModel 的相同实例，而不是为每次使用创建新的 CheckboxModel。在这种情况下，几个复选框列出现在第一个网格中，并且行为不正确。你能给我一些关于如何解决这个问题的想法吗？最简单的解决方案是为每个 xtype 使用创建新的 Ext.selection.CheckboxModel 实例，但这会使代码复制粘贴。

Answer 1

解决方案是将 selModel 定义移动到网格的 initComponent 属性：

Ext.define('MySimpleType',
{
    extend: 'Ext.grid.Panel',
    alias: 'widget.MySimpleXType',
    autoScroll: true,
    store: mySimpleStore,
    border: false,
    columns: [
        {
            header: 'Code',
            flex: 1,
            sortable: true,
            dataIndex: 'Code'
        },
        {
            header: 'Name',
            flex: 1,
            width: 80,
            sortable: true,
            dataIndex: 'Name'
        }
    ],
    initComponent: function(){
        this.selModel = Ext.create("Ext.selection.CheckboxModel", { checkOnly : true });
        this.callParent(arguments); //it's necessary to call in order to initialize parent components of this grid
    }
});