【ExtJS】關於alias和xtype

本文轉載自查看原文 2014-09-23 00:08 5473

alias

在api里的解釋為：別名類名稱簡短的別名列表。多數用於定義xtypes

 1 Ext.define('MyApp.Panel', {
 2     extend: 'Ext.panel.Panel',
 3     alias: 'widget.mypanel',
 4     title: 'MyPanel'
 5 });
 6 
 7 Ext.onReady(function(){
 8     // 使用 Ext.create
 9     Ext.create('widget.mypanel',{
10         html: 'Create Widget!',
11         width: 400,
12         height: 200,
13         broder: true,
14         renderTo: Ext.getBody()});
15 
16     // 使用xtype
17     Ext.widget('panel', {
18         renderTo: Ext.getBody(),
19         width: 400,
20         margin: '10 0 0 10 ',
21         broder: true,
22         items: [
23             {xtype: 'mypanel', html: 'Xtype1!'},
24             {xtype: 'mypanel', html: 'Xtyoe2!'}
25         ]
26     });
27 
28 
29 });

效果：

　　不過我在5.0官方例子中，經常看到例子里很少用alias來表示類的別名，而是經常用xtype來表示

 1 Ext.define('MyApp.Panel', {
 2     extend: 'Ext.panel.Panel',
 3     //alias: ['widget.mypanel'],
 4     xtype: 'mypanel',
 5     title: 'MyPanel'
 6 });
 7 
 8 Ext.onReady(function(){
 9     // 使用 Ext.create
10     Ext.create('widget.mypanel',{
11         html: 'Create Widget!',
12         width: 400,
13         height: 200,
14         broder: true,
15         renderTo: Ext.getBody()});
16 
17     // 使用xtype
18     Ext.widget('panel', {
19         renderTo: Ext.getBody(),
20         width: 400,
21         margin: '10 0 0 10 ',
22         broder: true,
23         items: [
24             {xtype: 'mypanel', html: 'Xtype1!'},
25             {xtype: 'mypanel', html: 'Xtyoe2!'}
26         ]
27     });
28 
29 
30 });

效果是一樣的，感覺這樣比原來的更好記，更直觀一些。

免責聲明！

本站轉載的文章為個人學習借鑒使用，本站對版權不負任何法律責任。如果侵犯了您的隱私權益，請聯系本站郵箱yoyou2525@163.com刪除。

猜您在找 ExtJs xtype類型介紹 elasticsearch alias vue中設置alias Elasticsearch 之索引別名 alias alias實現命令別名 TypeScript: type alias 與 interface nginx location和alias的區別 location之alias淺析 git alias All In One nodejs模塊路徑alias