mixin tutorial

by ATechieDiary

HTML

<link rel="stylesheet" href="http://extjs.cachefly.net/ext-4.0.2a/resources/css/ext-all.css">

JavaScript

Ext.define('CanSing', {
    canSingVar: 10,
    sing: function () {
        alert("I'm on the highway to mastering extJS...")
    }
});

Ext.define("Person", {
    mixins: {
        canSing: "CanSing"
    },
    sing: function () {
        alert("I'm a person who can sing ...");
        this.mixins.canSing.sing(); // .call();        
        Ext.Msg.show({
            title: 'test',
            msg: this.mixins.canSing.canSingVar,
            modal: true
        }); //will print 10
        //alert();
        this.mixins.canSing.canSingVar = 20;
        Ext.Msg.show({
            title: 'test',
            msg: this.mixins.canSing.canSingVar,
            modal: true
        }); //will print 20
    }
});

rr = Ext.create("Person");
rr.sing();