Question

我有以下流程：在应用程序启动之前，我想检查服务器上的内容。基于我想做出决定的回应。我创建了一个实用程序类，它包装了我的js事件和app控制器。

Bellow是app控制器：

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文件中处理。

代码适用于小提琴，也可以使用app watch，当我想构建代码时，一些错误正在发生抱怨（语法错误）。

我还创建了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

Extjs6自定义js事件

1 个答案: