关于Extjs afterLayout

Question

我在代码中添加了一个监听器：

listen: {
    afterLayout: function(){
        doSomething...
    }
}

该函数用于呈现html标记。但是当页面加载时它不起作用。我需要强制渲染页面，就像改变浏览器的大小一样。我想知道为什么。 ＆＃34; afterLayout＆＃34;页面加载后应该自动工作吗？或者我会错过什么？

Answer 1

您使用的配置错误。而不是listen: {使用listeners: {

以下是您的示例：https://fiddle.sencha.com/#fiddle/16gu

Ext.application({
    name : 'afterRender Test',

    launch : function() {
        Ext.create('Ext.container.Container', {
            renderTo: Ext.getBody(),
            listeners: {
                afterRender: function() {
                    this.update('<div style="width:300px; background-color:red; padding:10px;">Added via afterRender listener</div>');
                }
            }
        });
    }
});

Answer 2

我认为您搜索的事件是投降后的事件。 Afterlayout仅在窗口大小更改时触发，而不在负载上触发。 加载感兴趣组件的布局后的后续事件匹配。 所以你应该尝试这个：

listen: {
    afterrender: function(){
        doSomething...
    }
}

如果你必须在所有情况下调用相同的函数，请在afterrender和afterlayout上调用

Answer 3

我认为您的问题可以解决viewport。 将您的应用程序包装在此组件中视口将监听窗口大小更改并自动调整其子元素（您的应用程序）

的大小