extjs mixin example

最新推荐文章于 2018-11-20 21:05:03 发布

原创最新推荐文章于 2018-11-20 21:05:03 发布 · 233 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#extjs #mixin #javascript #ViewUI

javascript 专栏收录该内容

19 篇文章

订阅专栏

本文通过具体示例展示了如何在ExtJS中定义和使用Mixin。首先定义了一个名为HasCamera的简单Mixin类，该类包含一个takePhoto方法。接着创建了一个骨架类Cookbook.Smartphone，并通过mixins配置选项应用了HasCamera Mixin。最后，在Smartphone类中调用了mixin的takePhoto方法并通过实例化验证了其功能。


//1. Define our simple mixin class called HasCamera with a single //method called takePhoto:
Ext.define('HasCamera', {
takePhoto: function(){
alert('Say Cheese! .... Click!');
}
});
//2. Define a skeleton class and use the mixins configuration option //to apply our HasCamera mixin to our Cookbook.Smartphone class.
Ext.define('Cookbook.Smartphone', {
mixins: {
camera: 'HasCamera'
}
});
//3. We can now call our mixin's takePhoto method as part of the 
// Smartphone's class within a useCamera method:
Ext.define('Cookbook.Smartphone', {
mixins: {
camera: 'HasCamera'
},
useCamera: function(){
this.takePhoto();
}
});
//4. Instantiate the Smartphone class and call the useCamera method:
var smartphone = Ext.create('Cookbook.Smartphone');
smartphone.useCamera(); // alerts 'Say Cheese! .... Click!'