Reputation: 635
My code structure is as follows->
MyApp-> app -> controller, model, store, shared (util-> Utility.js), view
I have created the following Utility Class
Ext.define('MyApp.shared.util.Utilities', {
myFunction : function (val, meta, rec) {
//do something
return val;
}
});
I am trying to call the myFunction while rendering a column in my grid as follows ->
Ext.define('MyApp.view.MyGrid', {
extend: 'Ext.grid.Panel',
initComponent: function() {
var rendererFn = Ext.create('MyApp.shared.util.Utilities');
this.columns = [{
text: 'Col1',
dataIndex: 'col1'
renderer: rendererFn.myFunction
};
this.store = new MyApp.store.MyStore();
this.store.load();
this.callParent(arguments);
}
});
This works fine but I want to know if this is the correct way of using global functions.
Upvotes: 2
Views: 3291
Reputation: 30082
A better way would be to declare your class a singleton:
Ext.define('MyApp.shared.util.Utilities', {
singleton: true,
myFunction : function (val, meta, rec) {
//do something
return val;
}
});
Ext.define('MyApp.view.MyGrid', {
extend: 'Ext.grid.Panel',
initComponent: function() {
this.columns = [{
text: 'Col1',
dataIndex: 'col1'
renderer: MyApp.shared.util.Utilities.myFunction
}];
this.store = new MyApp.store.MyStore();
this.store.load();
this.callParent(arguments);
}
});
Upvotes: 8