Как связать слушателей в ExtJs?

Question

Я использую современный набор инструментов extjs 6.5.3 и озадачен следующим вопросом: как связать слушателей из viewModel для просмотра?

пример fiddle: https://fiddle.sencha.com/#view/editor&fiddle/30en

код:

Ext.application({
    name: 'Fiddle',

    launch: function () {
        let container1 = Ext.create("Ext.panel.Panel", {
            width: 640,
            height: 480,
            html: 'hello world!',

            viewModel: {
                data: {
                    // not works
                    listeners: {
                        onPlay: function () {
                             Ext.Msg.alert('onPlay', 'onPlay!');
                        }
                    },
                    title: 'test'
                }
            },

            // works
            //listeners: {
            //    onPlay: function () {
            //        Ext.Msg.alert('onPlay', 'onPlay!');
            //    }
            //},

            bind: {
                listeners: '{listeners}',
                title: '{title}'
            },

            controller: {
                init: function () {
                    this.getView().fireEvent('onPlay', this.getView());
                }
            }
        });

        Ext.Viewport.add({
            xtype: 'container',
            padding: 10,
            items: [container1]
        });
    }
});

Answer 1

Ваш код правильно связывает слушатель onPlay, но не работает, потому что связывание происходит после инициализации вашего контроллера. Если вы запустите событие onPlay позже, например, с использованием таймера, будет показано предупреждение. Чек https://fiddle.sencha.com/#view/editor&fiddle/30et