Question

var gusersPanel = Ext.create('Ext.grid.Panel', {
    flex:1,
    columns: [{
        header: 'User Login',
        dataIndex: 'user_login',
        width:150
    },{
        header: 'User Name',
        dataIndex: 'user_nicename',
        width:150
    },{
        header:'Privledge',
        dataIndex:'admin',
        width:150
    }],
    autoScroll: true,
    layout:'fit',
    selModel: gusersSel,
    store: gusersStore

}）

您好我在Extjs4.0.2a中使用网格面板的上述代码当我在商店中动态填充数据时，滚动条不起作用。我也尝试过将doLayout（）用于网格面板，但也很有用。网格面板位于窗口中。

什么能解决这个问题？

实际上它可以工作一段时间但不会一直工作。

Answer 1

我遇到了同样的问题。他们使用自定义滚动条，它很漂亮（特别是在chrome中）。如果您不打算使用无限滚动，可能的解决方案可能是删除自定义滚动条并使用本机滚动条。要做到这一点，只需将以下内容添加到网格的配置中：

var gusersPanel = Ext.create('Ext.grid.Panel', {
  scroll          : false,
  viewConfig      : {
    style           : { overflow: 'auto', overflowX: 'hidden' }
  },
  // ...
});

Answer 2

当我在商店中添加和删除数据时，我做了gusersPanel.determine Scrollbars（）并且工作正常。

Answer 3

这个问题是滚动侦听器附加到afterrender事件上的div元素，但是如果在布局操作后不需要滚动条，则从dom中删除div元素。然后，当它再次需要时，它会被添加回来，但是只有在足够的时间过去后，垃圾收集才会使extjs重新创建div节点，这次它被添加到dom中而不再添加滚动侦听器。以下代码解决了这个问题：

Ext.override(Ext.grid.Scroller, {
    onAdded: function() {
        this.callParent(arguments);
        var me = this;
        if (me.scrollEl) {
            me.mun(me.scrollEl, 'scroll', me.onElScroll, me);
            me.mon(me.scrollEl, 'scroll', me.onElScroll, me);
        }
    }
});

Answer 4

您编写了布局代码：＆＃39; fit＆＃39;。它没有工作autoScroll。

将代码更改为某个高度并删除布局：＆＃39; fit＆＃39;代码。

喜欢这个。

var gusersPanel = Ext.create('Ext.grid.Panel', {
    flex:1,
    columns: [{
   ...........
    }],
autoScroll: true,
//layout:'fit',
height: 130,
selModel: gusersSel,
store: gusersStore

这对你很有帮助。欢呼声。

Extjs 4中的网格面板滚动条无法正常工作

4 个答案: