ExtJS 3中locked: true无法锁定首列问题求助

嘿，我看你在尝试给ExtJS Grid的第一列加滚动锁定，但设置locked: true和拼写有误的enableautoLocking都没起效，结合你的代码片段，我整理了几个能搞定这个问题的关键点：

1. 先把配置项的拼写和位置搞对 #

首先，enableAutoLocking（注意是驼峰式，你写的enableautoLocking少了大写的A和L）是Grid组件本身的配置项，不是列的配置！你得把它加到Grid的全局配置里，而不是列定义中。

2. 换掉旧的ColumnModel写法（针对ExtJS 4+） #

你的代码里用了Ext.grid.ColumnModel来定义列，但在ExtJS 4及以后的版本里，Grid已经支持直接通过columns属性配置列，不需要单独创建ColumnModel了——这种旧写法很可能导致锁定功能失效。

给你改好的核心Grid配置片段：

Ext.apply(this, {
    cls: 'fieldgrid',
    // 去掉多余的layout: 'table'，Grid有自己的布局逻辑，这个会干扰锁定列
    store: this.fieldStore,
    autoScroll: true,
    enableAutoLocking: true, // 正确的配置位置和拼写
    loadMask: CNQR.admin.loadMask,
    plugins: headerCategoryGroup,
    // 直接用columns替代ColumnModel
    columns: this.columns,
    selModel: selectModel,
    tbar: new Ext.Toolbar({
        ctCls: 'grayButtonToolBar border-toolbar',
        buttons: [ this.saveButton, this.cancelButton ]
    }),
    bbar: new Ext.PagingToolbar({
        store: this.fieldStore,
        pageSize: this.pageSize,
        displayInfo: true,
        beforePageText: CNQR.getMsg('bbarBeforePageText'),
        afterPageText: CNQR.getMsg('bbarAfterPageText'),
        displayMsg: CNQR.getMsg('bbarDisplayMsg'),
        emptyMsg: CNQR.getMsg('bbarNoRecordsFound')
    })
});

3. 移除冲突的布局配置 #

你给Grid加了layout: 'table'，但Grid本身有专门的布局渲染逻辑，这个额外的table布局会干扰锁定列的渲染，直接删掉就行。

4. 版本兼容性要注意 #

如果你用的是ExtJS 3.x，那锁定列的实现逻辑不一样：

• 必须用Ext.grid.LockingGridPanel作为你的Grid基类，而不是普通的GridPanel
• 配置项是enableLocking: true，而不是enableAutoLocking

最后试一下这些调整 #

先按上面的步骤修改代码，重点修正配置项的拼写和位置、换掉ColumnModel写法、移除多余的布局配置，应该就能让第一列的滚动锁定生效了。

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