Question

调用updateLayout（）会导致父容器“跳转”到顶部。在Ext.Container.container上设置viewconfig似乎没有帮助

viewConfig: {
    preserveScrollOnRefresh: true
},

Answer 1

正如亚历山大所建议的那样，为父容器覆盖beforeLayout和afterLayout就可以了。

beforeLayout: function() {
    var me = this,
        scroller = me.getScrollable();
    me.callParent(arguments);
    if (scroller) {
        me.savedScrollPos = scroller.getPosition();
    }
},
afterLayout: function() {
    var me = this,
        scroller = me.getScrollable();
    me.callParent(arguments);
    if (scroller && me.savedScrollPos) {
        scroller.scrollTo(me.savedScrollPos);
    }
},

Answer 2

updateLayout与refresh不同，preserveScrollOnRefresh仅保留refresh上的滚动。你可以查看ExtJS代码是如何做到的（它们并不真正“保留”滚动，它们存储滚动位置并在刷新后滚动回正确的位置）并为updateLayout实现相同的功能。

Answer 3

为有类似问题的人提供更多选择：

更改布局

如问题Avoid Ext.form validation scrolling to top中所述，有时只需更改layout即可。

例如，ExtJS 4.x中的表单默认指定了anchor布局（ExtJS 6有vbox），这导致表单在表单字段验证时滚动到顶部，如果更改布局到vbox，它不会滚动到顶部。

暂停布局

如果您有一个组件，不需要通过更改来更新布局，您可以使用suspendLayout配置。

updateLayout（）导致父容器滚动到顶部

3 个答案: