Extjs6 自定义js事件

Question

我有以下流程：在应用程序启动之前，我想检查服务器上的某些内容。根据回复，我想做出决定。我创建了一个实用程序类来包装我的 js 事件以及一个应用程序控制器。

下面是应用控制器：

Ext.define('MyApp.controller.AppController', {
    extend: 'Ext.app.Controller',
    appEventDispatcher:function (){
      // Create a dummy DOM element 
        var dummy = document.createTextNode('');

        // Create custom wrappers with nicer names
        this.off = dummy.removeEventListener.bind(dummy);
        this.on = dummy.addEventListener.bind(dummy);
        this.trigger = function(eventName, data){
            if( !eventName ) return;
            var e = new CustomEvent(eventName, {"detail":data});
            dummy.dispatchEvent(e);
        }
    }
 });

还有我的实用类：

Ext.define('MyApp.util.Util', {

    statics : {
        checkSomethingOnServer: function(customEvent){
            var store = Ext.StoreManager.lookup('appStore');
            store.load({
                scope: this,
                callback: function(records, operation, success){
                    if (success === true){
                        customEvent.trigger('success', true);
                    if (success === false)
                        debugger;
                        customEvent.trigger('fail', true);   
                    }
                }
            });
        }

    }
});

使用实用程序类我加载了一个商店。在回调方法中，我触发了我的自定义事件。此事件在 app.js 文件中处理。

代码在小提琴中工作，也使用应用程序手表，当我想构建代码时，出现一些错误抱怨（语法错误）。

我还创建了一个fiddle。

如何在 ExtJS 中创建自定义事件以及如何使用它？我需要与 js 事件相同的行为，但需要 Extjs 实现。

Answer 1

在 ExtJS 中，您只需使用自定义事件的名称将事件侦听器附加到商店：

store.on('myownevent', function(success) {
    console.log(success);
});

您的代码可能会继续并以该名称在商店中触发事件：

store.load({
    scope: this,
    callback: function(records, operation, success){
        store.fireEvent('myownevent', success);
    }
});

如果没有附加该事件的侦听器，则不会发生任何事情；如果附加了一个或多个侦听器，它们将按优先级顺序执行，对于具有相同优先级的侦听器，按添加顺序执行。

https://fiddle.sencha.com/#view/editor&fiddle/21g7