Make the local variable to global in extjs

Question

How to make local variable to global?

Ext.define('A.view.Management', {
extend: 'Ext.container.Container',

requires: [
    'A.store.Management',
],

border: false,
chart: null,

hrer: [],   

initComponent: function () {
    var me = this;

    me.jobStore2 = Ext.create('O2a.store.Management');


    Ext.Ajax.request({
        url: utils.createUrl('api', 'ard-read'),
        async: true,

        callback: function(opts, success, response) {
            try {

                if (success) {
                    var output = App.decodeHttpResp(response.responseText);
                    const data = output.data;

                    let myArr = [];
                    data.map((date) => 
                    myArr = Object.keys(date).filter(key => key != 'DATE'));
                    me.hrer =myArr;

                    console.log(me.hrer);

                    if (output.success) {
                        //return output.success;
                    } else {
                        //return output.error;
                    }
                } else {
                    //return 'Unknown Reason';
                }
            } catch (ex) {
                //return ex;
            }
        }
    });
console.log(me.hrer);

I want to take hrer array to outside. When I console.log it outside the ajax request I am getting an empty array which I have defined as globally. I couldn't pass the values which getting inside the ajax request to outside

Answer 1

In ExtJS 4, we used to do:

Ext.define('A.store.SharedData', { 
    singleton: true, 

    foo: 'bar', 
    johnDoeAge: 42,
    hrer: []
}); 

Then require it in whichever component you want to use and consume it like:

Ext.define('A.view.Management', {
    extend: 'Ext.container.Container',

    requires: [
        'A.store.Management',
        'A.store.SharedData'
    ],




    initComponent: function () {
        var me = this;
        A.store.SharedData.hrer = [1, 2, ...];
        ...
    }
    ...
});