Extjs 经典网格面板滚动答案

【问题标题】：Extjs classic grid panel scrollExtjs 经典网格面板滚动
【发布时间】：2021-01-09 16:59:13
【问题描述】：

Extjs 6.2.0

有这个面板

Ext.create('Ext.grid.Panel', {
                    region: 'center',
                    padding: 5,
                    reserveScrollbar: false,
                    scrollable: true,
                    columnLines: false,
                    rowLines: false,
                    disableSelection: true,
                    viewConfig: {
                        stripeRows: false,
                        trackOver: false,
                        preserveScrollOnRefresh: true
                    },
                    store: 'chatmessagesstore',
                    hideHeaders: true,
.....

一列带渲染器

Ext.form.Panel 中带有布局边框的网格。和布局 FIT 的窗口中的 Ext.form.Panel。 Store 就是 MemoryStore

我将记录添加到存储中，然后它显示在网格中。但是如果我添加超过 50 条记录来存储，我会在网格的底部看到空白空间。在最后的 Chrome 中，我看到了空白区域。在上一个“Sputnik”浏览器（俄语）中，我没有看到空格

我认为这是错误的滚动条计算。但是怎么解决呢？我的头坏了）

【问题讨论】：

您能否在 fiddle.sencha.com 中重现此行为？
嗯。我会尝试，但我认为不会（
示例fiddle.sencha.com/#view/editor&fiddle/391l

标签： extjs scroll grid height

【解决方案1】：

在您的网格中将 bufferedRenderer 属性设置为 false..

...
...
/**
 * Create chat box
 *
 * @return {Ext.grid.Panel}
 */
createChatBox: function () {
    var me = this;
    if (!me.chatBox) {
        console.log('creating');
        this.chatBox = Ext.create('Ext.grid.Panel', {
            region: 'center',
            padding: 5,
            reserveScrollbar: false,
            scrollable: true,
            columnLines: false,
            rowLines: false,
            disableSelection: true,
            bufferedRenderer: false, // SET IT TO FALSE
            viewConfig: {
                stripeRows: false,
                trackOver: false,
                preserveScrollOnRefresh: true
            },
            store: 'chatmessagesstore',
            hideHeaders: true,
            columns: [{
...
...

【讨论】：