javascript - Ext中Ext.tab.Panel 组件问题
怪我咯
怪我咯 2017-04-11 12:33:17
[JavaScript讨论组]

Ext.tab.Panel 组件代码:
Ext.define("myapp.view.application.TabMain", {

extend : "Ext.tab.Panel",
xtype : "tabmainT",
id : "tabmainT",
config : {
    tabBarPosition : 'bottom',
    defaults : {
        layout : 'fit'
    },
    tabBar : {
        hidden : true
    },
    items : [ {
        numb : 0,
        iconCls : "tabpostion",//指定背景图片样式类
        scrollable : true,
        items : [ {
            docked : 'top',
            items : [ {
                xtype : "panel",
                html : '第一个HTML',
                width : '100%'
            } ]

        } ]
    }, {
        numb: 1,
        iconCls: "tabpostion",
        scrollable: true,
        items:[{
            docked:'top',
            items : [{
                xtype : "panel",
                html : 
                    '第二个HTML',
               width:'100%'
            }]

        } ]
    },{
        numb: 2,
        iconCls: "tabpostion",
        scrollable: true,
        items:[{
            docked:'top',
            items : [{
                xtype : "panel",
                html : 
                    '第三个HTML',
               width:'100%'
            }]

        } ]
    } , {
        numb: 3,
        iconCls: "tabpostion",
        scrollable: true,
        items:[{
            docked:'top',
            items : [{
                xtype : "panel",
                html : 
                    '第四个HTML',
               width:'100%'
            }]

        } ]
    } , {
        numb: 4,
        iconCls: "tabpostion",
        scrollable: true,
        items:[{
            docked:'top',
            items : [{
                xtype : "panel",
                html : 
                    '第五个HTML',
               width:'100%'
            }]

        } ]
    } , {
        numb: 5,
        iconCls: "tabpostion",
        scrollable: true,
        items:[{
            docked:'top',
            items : [{
                xtype : "panel",
                html : 
                    '第六个HTML',
               width:'100%'
            }]

        } ]
    }]
}

});

当我把{

        numb: X,
        iconCls: "tabpostion",
        scrollable: true,
        items:[{
            docked:'top',
            items : [{
                xtype : "panel",
                html : 
                    '第六个HTML',
               width:'100%'
            }]

        } ]
    }

的html代码去掉 xtype指定指定一个panel 然后就报错:

panel代码 Ext.define('myapp.view.application.Home',{

extend : 'Ext.Panel',
xtype:'home',
id:'home',
config : {
    layout:{
       type:'vbox',
       align:'stretch'        //子组件将填满整个宽度
    },
    
    items:[
        {
            xtype:'tabmainT',
            numb:0,    
            flex:13,
        },
        {
            flex:1,
            docked:'bottom',
            html:' 

'+ '

    '+ '
  • 首页
  • '+ '
  • 购车
  • '+ '
  • 购房
  • '+ '
  • 叫单
  • '+ '
  • 客服
  • '+ '
  • 设置
  • '+ '

    '+ '
'+ '

' } ] }, initialize : function() { this.callParent(); this.on({ painted : 'onPainted', scope : this }); }, onPainted:function(cmp, eOpts){ $(function(){ $("#shouye").click(function(){ $("#shouye").addClass("bottom_icon icon01 current_01"); $("#gouche").attr("class","bottom_icon icon02"); $("#goufang").attr("class","bottom_icon icon03"); $("#jiaodan").attr("class","bottom_icon icon04"); $("#kefu").attr("class","bottom_icon icon05"); $("#shezhi").attr("class","bottom_icon icon06"); Ext.getCmp("tabmainT").setActiveItem(0); }); $("#gouche").click(function(){ $("#shouye").attr("class","bottom_icon icon01"); $("#gouche").addClass("bottom_icon icon02 current_02"); $("#goufang").attr("class","bottom_icon icon03"); $("#jiaodan").attr("class","bottom_icon icon04"); $("#kefu").attr("class","bottom_icon icon05"); $("#shezhi").attr("class","bottom_icon icon06"); Ext.getCmp("tabmainT").setActiveItem(1); }); $("#goufang").click(function(){ $("#shouye").attr("class","bottom_icon icon01"); $("#gouche").attr("class","bottom_icon icon02"); $("#goufang").addClass("bottom_icon icon03 current_03"); $("#jiaodan").attr("class","bottom_icon icon04"); $("#kefu").attr("class","bottom_icon icon05"); $("#shezhi").attr("class","bottom_icon icon06"); Ext.getCmp("tabmainT").setActiveItem(2); }); $("#jiaodan").click(function(){ $("#shouye").attr("class","bottom_icon icon01"); $("#gouche").attr("class","bottom_icon icon02"); $("#goufang").attr("class","bottom_icon icon03"); $("#jiaodan").addClass("bottom_icon icon04 current_04"); $("#kefu").attr("class","bottom_icon icon05"); $("#shezhi").attr("class","bottom_icon icon06"); Ext.getCmp("tabmainT").setActiveItem(3); }); $("#kefu").click(function(){ $("#shouye").attr("class","bottom_icon icon01"); $("#gouche").attr("class","bottom_icon icon02"); $("#goufang").attr("class","bottom_icon icon03"); $("#jiaodan").attr("class","bottom_icon icon04"); $("#kefu").addClass("bottom_icon icon05 current_05"); $("#shezhi").attr("class","bottom_icon icon06"); Ext.getCmp("tabmainT").setActiveItem(4); }); $("#shezhi").click(function(){ $("#shouye").attr("class","bottom_icon icon01"); $("#gouche").attr("class","bottom_icon icon02"); $("#goufang").attr("class","bottom_icon icon03"); $("#jiaodan").attr("class","bottom_icon icon04"); $("#kefu").attr("class","bottom_icon icon05"); $("#shezhi").addClass("bottom_icon icon06 current_06"); Ext.getCmp("tabmainT").setActiveItem(5); }); }); }

});
求大神帮忙告诉我哪里错了,如何改正

怪我咯
怪我咯

走同样的路,发现不同的人生

全部回复(0)
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号