如何在商店中覆盖afterRequest

时间:2016-01-15 08:09:25

标签: extjs sencha-cmd

基于此修复程序:http://bit.ly/1Pf59ui,您必须扩展" Ext.data.proxy.Ajax"。但是,我的一家商店看起来像这样:

Ext.define('EcommBackoffice.store.Banks',{
    extend:'Ext.data.Store',
    model:'EcommBackoffice.model.BankModel',
    storeId: 'bank-store-id',
    autoLoad:false,
    sorters: [{
        property: 'name',
        direction:'ASC'
    }],
    config: {
        loaded:false
    },
    isLoaded: function(){
        return this.getLoaded()
    },
    listeners: {
        load: function(currentthis, records, successful){
            if(successful === true){
                this.setLoaded(true)    
            }
        }
    },
    proxy: {
        $configStrict: false,
        type: 'rest',
        id: 'app-banks',
        url: EcommBackoffice.Global.getAPIEndPoints().banks,
        reader: {
            type: 'json',
            rootProperty: 'bank'
        },
        api:{
            create: EcommBackoffice.Global.getAPIEndPoints().banks,
            update: EcommBackoffice.Global.getAPIEndPoints().banks,
            destroy: EcommBackoffice.Global.getAPIEndPoints().banks
        },

        listeners: {
            exception: function(proxy, response, op) {
                var oBankStore = Ext.getStore('bank-store-id');
                if(response.status === 403 || response.status === 401 || response.status === 503) return; /*skip this exception handler and refer to Applciation Controller handler*/
                Ext.Msg.alert('ERROR', response.responseText + ' ' +response.statusText);
            }            
        },
        afterRequest:function(request,success){
            if(request.method = 'POST' && success){
                var oAddBankWindow = Ext.ComponentQuery.query('#add-bank-window');
                if(oAddBankWindow[0]) {
                    oAddBankWindow[0].down('#msgPanel').update('<span style="">New bank added</span>');
                    oAddBankWindow[0].down('#countryName').update('');
                    oAddBankWindow[0].down('form').getForm().reset();
                }
            }
        }              
    }


});

如何扩展&#34; Ext.data.proxy.Ajax&#34;如果我已经在扩展&#34; Ext.data.Store?&#34;当我使用$configStrict来允许覆盖时,当前错误将替换为此错误:

Uncaught TypeError: sorter.getRoot is not a function

解决这个问题的正确方法是什么?我目前正在将现有的ExtJS 4.2应用程序升级到6.x。

1 个答案:

答案 0 :(得分:2)

Ext.data.Store和Ext.data.proxy.Ajax是两个不同的类,不是出于同一目的。商店使用代理。

所以我在ExtJs 6中的方法是创建自定义代理,扩展REST代理(在您的情况下),并将类型设置为自定义代理。

/**
 * Custom Proxy
 **/
Ext.define('EcommBackoffice.proxy.MyRestProxy', {
    extend: 'Ext.data.proxy.Rest',
    alias: 'proxy.bank-proxy',

    /**
     * @override
     **/
    afterRequest:function(request,success){

        this.callParent(arguments); // call to parent as this is a template method

        if(request.method = 'POST' && success){
            var oAddBankWindow = Ext.ComponentQuery.query('#add-bank-window');
            if(oAddBankWindow[0]) {
                oAddBankWindow[0].down('#msgPanel').update('<span style="">New bank added</span>');
                oAddBankWindow[0].down('#countryName').update('');
                oAddBankWindow[0].down('form').getForm().reset();
            }
        }
    }

});

Ext.define('EcommBackoffice.store.Banks',{
    extend:'Ext.data.Store',
    requires: ['EcommBackoffice.proxy.MyRestProxy'],

    model:'EcommBackoffice.model.BankModel',
    storeId: 'bank-store-id',
    autoLoad:false,
    sorters: [{
        property: 'name',
        direction:'ASC'
    }],
    // Already existing in Extjs 6
    // config: {
    //     loaded:false
    // },
    // isLoaded: function(){
    //     return this.getLoaded()
    // },
    // listeners: {
    //     load: function(currentthis, records, successful){
    //         if(successful === true){
    //             this.setLoaded(true)    
    //         }
    //     }
    // },
    proxy: {
        type: 'bank-proxy',
        id: 'app-banks',
        url: EcommBackoffice.Global.getAPIEndPoints().banks,
        reader: {
            type: 'json',
            rootProperty: 'bank'
        },
        api:{
            create: EcommBackoffice.Global.getAPIEndPoints().banks,
            update: EcommBackoffice.Global.getAPIEndPoints().banks,
            destroy: EcommBackoffice.Global.getAPIEndPoints().banks
        },

        listeners: {
            exception: function(proxy, response, op) {
                var oBankStore = Ext.getStore('bank-store-id');
                if(response.status === 403 || response.status === 401 || response.status === 503) return; /*skip this exception handler and refer to Applciation Controller handler*/
                Ext.Msg.alert('ERROR', response.responseText + ' ' +response.statusText);
            }            
        }         
    }

});