ExtJs4-Ext.tab.Panel添右键关闭

 /**
  * 程序主入口
  */
 Ext.onReady(function() {

     Ext.require(['Ext.panel.Panel', 'Ext.tab.Panel', 'Ext.tree.Panel',
             'Ext.data.TreeStore', 'Ext.container.Viewport',
             'Ext.ux.TabCloseMenu']);

     /**
      * 上,panel.Panel
      */
     this.topPanel = Ext.create('Ext.panel.Panel', {
                 region : 'north',
                 height : 55,
                 contentEl : 'header'
             });
     /**
      * 左,panel.Panel
      */
     this.leftPanel = Ext.create('Ext.panel.Panel', {
                 region : 'west',
                 title : '导航栏',
                 width : 230,
                 layout : 'accordion',
                 collapsible : true
             });
     /**
      * 右,tab.Panel
      */
     this.rightPanel = Ext.create('Ext.tab.Panel', {
                 region : 'center',
                 layout : 'fit',
                 minTabWidth : 100,
                 plugins : Ext.create('Ext.ux.TabCloseMenu', {
                             closeTabText : '关闭当前页',
                             closeOthersTabsText : '关闭其他页',
                             closeAllTabsText : '关闭所有页'
                         }),
                 items : [{
                             title : '首页'
                         }]
             });

     /**
      * 下,panel.Panel
      */
     this.bottomPanle = Ext.create('Ext.panel.Panel', {
         region : 'south',
         height : 26,
         bbar : ['->', {
             xtype : 'combo',
             editable : false,
             labelAlign : 'right',
             emptyText : '更换皮肤',
             store : [['id_1', 'name_1'], ['id_2', 'name_2'], ['id_3', 'name_3']],
             queryMode : 'local',
             listeners : {
                 'select' : function(combo, record, index) {
                     if (combo.value != '') {
                         alert(combo.value);
                     }
                 }
             }
         }]
     });

     /**
      * 组建树
      */
     var buildTree = function(json) {
         return Ext.create('Ext.tree.Panel', {
                     rootVisible : false,
                     border : false,
                     store : Ext.create('Ext.data.TreeStore', {
                                 root : {
                                     expanded : true,
                                     children : json.children
                                 }
                             }),
                     listeners : {
                         'itemclick' : function(view, record, item, index, e) {
                             var id = record.get('id');
                             var text = record.get('text');
                             var leaf = record.get('leaf');
                             if (leaf) {
                                 alert('id-' + id + ',text-' + text + ',leaf-'
                                         + leaf);
                             }
                         },
                         scope : this
                     }
                 });
     };
     /**
      * 加载菜单树
      */
     Ext.Ajax.request({
                 url : 'data/Tree.txt',
                 success : function(response) {
                     var json = Ext.JSON.decode(response.responseText)
                     Ext.each(json.data, function(el) {
                                 var panel = Ext.create('Ext.panel.Panel', {
                                             id : el.id,
                                             title : el.text,
                                             layout : 'fit'
                                         });
                                 panel.add(buildTree(el));
                                 leftPanel.add(panel);
                             });
                 },
                 failure : function(request) {
                     Ext.MessageBox.show({
                                 title : '操作提示',
                                 msg : "连接服务器失败",
                                 buttons : Ext.MessageBox.OK,
                                 icon : Ext.MessageBox.ERROR
                             });
                 },
                 method : 'post'
             });
     /**
      * Viewport
      */
     Ext.create('Ext.container.Viewport', {
                 layout : 'border',
                 renderTo : Ext.getBody(),
                 items : [this.topPanel, this.leftPanel, this.rightPanel,
                         this.bottomPanle]
             });
 });

后台返回数据 

{success:true,data:[{id:'father_1',text:'功能列表',leaf:false,children:[{id:'UserView',text:'用户管理',leaf:true}]}]}

原文链接:http://renxin-327666062-qq-com.iteye.com/blog/1297682