How to override model in EXTJS and add extra field? - extjs

Question

How to override model in EXTJS?
For example, if I have a model defined as:
Ext.define('Mypp.model.Class1', {
extend: 'Ext.data.Model',
fields: [{
name: 'field1',
type: 'string'
}],
getField1: function() {
return this.data.field1;
},
setField1: function(field1) {
this.set('field1', field1);
},
});
how can I override it and add extra field ```field3``
For example, how to override the following class and add extra field(s)?
Ext.define('Ext.calendar.model.Event', {
extend: 'Ext.data.Model',
mixins: ['Ext.calendar.model.EventBase'],
fields: [{
name: 'title',
type: 'string'
}, {
name: 'color',
type: 'string'
}],
getColor: function() {
return this.data.color;
},
getTitle: function() {
return this.data.title;
},
setColor: function(color) {
this.set('color', color);
},
setTitle: function(title) {
this.set('title', title);
}
});
I tried

Answer 1

I don`t understand why you need this, but anyway:
Ext.define('Mypp.model.Class1', {
extend: 'Ext.data.Model',
fields: [{
name: 'field1',
type: 'string'
}],
getField1: function() {
return this.data.field1;
},
setField1: function(value) {
this.set('field1', value);
},
});
Ext.define('overrides.model.Class1', {
override: 'Mypp.model.Class1',
fields: [{
name: 'field1',
type: 'string'
}, {
name: 'field2',
type: 'string'
}],
getField2: function() {
return this.get('field2');
},
setField2: function(value) {
this.set('field2', value);
}
});
model = new Mypp.model.Class1();
model.setField1('Field1Value');
model.setField2('Field2Value');
console.log(
model.getField1(),
model.getField2()
);