динамическая кнопка extjs на панели

Question

Иметь этот код

Ext.define('C.YmkDetPanel', {
    extend: 'Ext.Panel',
    xtype: 'YmkDetPanel',
    conttroller: 'ccc',

    viewModel: {
        type: 'ymkDetModel'
    },

    bind: {
    html: '<div> {zzz} </div> <div id = "button"> </div>'

    },
    listeners: {
        painted: function (  ) {
            new Ext.Button({
                renderTo: 'button',
                scope: this,
                text: 'Click Me',
                listeners: 
                {
                    tap: function() {
                        alert(this.up());
                    }               
                }
            }); 
        }
    },  
    initComponent: function() {


    this.callParent(arguments);                             
    }           
});

Я вижу созданную кнопку.Но по щелчку this.up () имеет значение null.Это кнопка.

Как получить доступ к C.YmkDetPanel из кнопки?В Окрашенном событии ЭТО является "Ext.dom.Element"

Answer 1

Используйте контейнер и вложите 2 элемента отдельно, Скрипка :

Ext.define('C.YmkDetPanel', {
    extend: 'Ext.Panel',
    xtype: 'YmkDetPanel',

    viewModel: {
        data: {
            zzz: 'foo'
        }
    },

    items: [{
        xtype: 'component',
        bind: '{zzz}'
    }, {
        xtype: 'button',
        text: 'Click me'
    }]
});

Ext.application({
    name : 'Fiddle',

    launch : function() {
        Ext.Viewport.add({
            xtype: 'YmkDetPanel'
        });
    }
});