ExtJS：获取动态容器的绝对位置

Question

我需要找出动态创建的容器的绝对位置，这些容器被添加到面板中。

var activityContainer = Ext.create('Ext.Container', {
    html: activityName,
    width: ACTIVITY_WIDTH,
    height: ACTIVITY_HEIGHT,
    margin: topMargin + ' 0 0 0',
    cls: 'activity',
    listeners: {
        render: function () {
             this.getEl().dom.title = 'Name: ' + activity.name + reqQuicktip;
        },
        afterrender: function() {
             console.log('Y: ' + this.getEl().getTop() +' X: '+ this.getEl().getLeft())
        }
     }
})

tradePanel.add(activityContainer);

我了解到只有在容器已经渲染后才能获得位置。因此我使用 afterrender 监听器。 getY()/getTop() 等方法没有按我预期的方式工作。我的 x 坐标总是得到 1 而没有足够的 y 坐标。

我在这里错过了什么？

谢谢！

Answer 1

根据您实现面板的方式，关键字this 可能会返回错误面板的信息。

你像这样创建你的监听器：

afterrender: function(component) {
    console.log('Y: ' + component.getY() +' X: '+ component.getX());
}

这里有一个小提琴供你测试：https://fiddle.sencha.com/#fiddle/cud