找了快1個小時，就是不知道錯誤在哪里。。。郁悶
我在鼠標左側(cè)點擊tree節(jié)點，在右側(cè)創(chuàng)建一個標簽頁，這個已經(jīng)能夠?qū)崿F(xiàn)，于是我再在新建的標簽頁里嵌套一個Grid。
奇怪的問題出現(xiàn)了。。
FF和IE下都沒報錯。但是Grid就是不顯示。本來我以為我代碼錯誤。于是我狂找我的代碼問題，無意中關掉FF的firbug插件界面，grid就現(xiàn)實出來了。。。原來只要我的窗口發(fā)生任何變化Grid才會顯示出來。
請問這是我代碼問題還是bug？如何解決？
補充一下，我直接在TabPanel里面用items管理grid對象并沒問題。但是我用添加事件后在其中管理就出問題了。
文件都是封裝在類包里面的。所以只貼關鍵部分
這是監(jiān)聽事件。
Java代碼
listeners:{
'click':function(node, event) {
event.stopEvent();
//把根節(jié)點的選擇判斷去除
if(node.text=="SamPeng" || node.text == "文章管理" || node.text == "產(chǎn)品管理" || node.text == "信息管理" || node.text == "來訪管理"){
}else{
var n = main.getComponent(node.id);
if (!n) { //判斷是否已經(jīng)打開該面板
//如果是按的文章列表，新建一個列表對象并且丟進新的標簽頁
if(node.text == "文章列表"){
var grid=new SamPeng.account.list();
n = main.add({
'id':node.id,
'title':node.text,
items: [{layout:"fit",items:grid}]
});}
}
main.setActiveTab(n);
}
}
listeners:{
                'click':function(node, event) {
                         event.stopEvent();
                        //把根節(jié)點的選擇判斷去除
                        if(node.text=="SamPeng" || node.text == "文章管理" || node.text == "產(chǎn)品管理" || node.text == "信息管理" || node.text == "來訪管理"){
                        }else{
                            var n = main.getComponent(node.id);
                            if (!n) { //判斷是否已經(jīng)打開該面板
                                    //如果是按的文章列表，新建一個列表對象并且丟進新的標簽頁
                                if(node.text == "文章列表"){
                                    var grid=new SamPeng.account.list();
                                    n = main.add({
                                    'id':node.id,
                                    'title':node.text,
                                     items: [{layout:"fit",items:grid}]
                                });}
                            }
                         main.setActiveTab(n);
                            }
                        }
然后是我的tab面板創(chuàng)建類
Java代碼
* Copyright(c) 2008-2010, SamPeng Inc.
*/
package("SamPeng.panel");
/**
* 作用: 用來創(chuàng)建中間的主顯示面板
* 作者：SamPeng
* 時間：2008年9月24日1:24:42
*/
SamPeng.panel.main = function(config){
var config=config || {};
var deconfig={
renderTo:'mainlay',
width:1000,
height:561,
activeTab:0,
plain: true,
border: true,
tabPosition: 'top',
frame: true,
autoScroll: true,
enableTabScroll:true,//超過寬度就自動兩邊多出滾動條
items:[{
title:"首頁"
}
]
}
Ext.applyIf(config,deconfig);
SamPeng.panel.main.superclass.constructor.call(this,config);
}
Ext.extend(SamPeng.panel.main,Ext.TabPanel);
* Copyright(c) 2008-2010, SamPeng Inc.
*/
package("SamPeng.panel");
/**
* 作用: 用來創(chuàng)建中間的主顯示面板
* 作者：SamPeng
* 時間：2008年9月24日1:24:42
*/
    SamPeng.panel.main = function(config){

        var config=config || {};
        var deconfig={
                    renderTo:'mainlay',
                    width:1000,
                    height:561,
                    activeTab:0,
                    plain: true,
                    border: true,
                    tabPosition: 'top',
                    frame: true,
                    autoScroll: true,
                    enableTabScroll:true,//超過寬度就自動兩邊多出滾動條
                 items:[{
                                title:"首頁"
                            }
                         ]            
                    }
        Ext.applyIf(config,deconfig);
        SamPeng.panel.main.superclass.constructor.call(this,config);
     }
    Ext.extend(SamPeng.panel.main,Ext.TabPanel);
Grid的就只貼數(shù)據(jù)源和屬性的了。
Java代碼
/*******************************************************
* 為表格建立數(shù)據(jù)源
* 鏈接后臺，并且按每一頁的數(shù)據(jù)列表返回
* 用Json數(shù)據(jù)格式傳遞
*******************************************************/
this.dataStore = new Ext.data.Store({
proxy: new Ext.data.HttpProxy({
url: 'php/article_list.php',
disableCaching:false
}),
reader: new Ext.data.JsonReader({
root: 'results',
totalProperty: 'total',
id:'id'
},[
{name: 'id'},
{name: 'name'},
{name: 'typename'},
{name: 'time'},
])
});
this.dataStore.load({params:{start:0, limit:this.myPageSize}});
。。。
。。。省略很多
。。。
/*******************************************************
* 構(gòu)造編輯列表面板（GridPanel）
*******************************************************/
SamPeng.account.list.superclass.constructor.call(this, {
id: 'list-account-panel',
ds: this.dataStore,
cm: art_cm,
sm: selectBoxModel,
height:500,
tbar: pagingbar,
bbar: menubar,
loadMask: {msg: '讀取數(shù)據(jù)中 ...'},
enableColumnHide: false,
autoScroll:true
//region:'center'
});
Ext.extend(SamPeng.account.list, Ext.grid.GridPanel, {
reload : function() {
this.dataStore.load({params:{start:0, limit:this.myPageSize}});
},
// 調(diào)用刪除數(shù)據(jù)
// 服務器通過接受參數(shù)返回刪除的數(shù)據(jù)
deleteData : function (jsonData) {
this.dataStore.load({params:{start:0, limit:this.myPageSize, delData:jsonData}});
}

        /*******************************************************
        * 為表格建立數(shù)據(jù)源
        *     鏈接后臺，并且按每一頁的數(shù)據(jù)列表返回
        *    用Json數(shù)據(jù)格式傳遞
        *******************************************************/
        this.dataStore = new Ext.data.Store({
            proxy: new Ext.data.HttpProxy({
             url: 'php/article_list.php',
             disableCaching:false
            }),

            reader: new Ext.data.JsonReader({
                root: 'results',
                totalProperty: 'total',
                id:'id'
            },[
             {name: 'id'},
             {name: 'name'},
             {name: 'typename'},
             {name: 'time'},
            ])
        });
        this.dataStore.load({params:{start:0, limit:this.myPageSize}});    
。。。
。。。省略很多
。。。
        /*******************************************************
        * 構(gòu)造編輯列表面板（GridPanel）
        *******************************************************/
        SamPeng.account.list.superclass.constructor.call(this, {
                id: 'list-account-panel',
                ds: this.dataStore,
                cm: art_cm,    
                sm: selectBoxModel,
                height:500,
                tbar: pagingbar,
                bbar: menubar,
                loadMask: {msg: '讀取數(shù)據(jù)中 ...'},
                enableColumnHide: false,
                autoScroll:true
                //region:'center'
        });
Ext.extend(SamPeng.account.list, Ext.grid.GridPanel, {
reload : function() {
        this.dataStore.load({params:{start:0, limit:this.myPageSize}});    
    },
// 調(diào)用刪除數(shù)據(jù)
// 服務器通過接受參數(shù)返回刪除的數(shù)據(jù)
deleteData : function (jsonData) {
    this.dataStore.load({params:{start:0, limit:this.myPageSize, delData:jsonData}});
}    
謝謝各位大俠了！
問題狀況是我瀏覽器不動，Grid死活不顯示，瀏覽器一變，Grid就出來了。而且是按照我設定的參數(shù)大小顯示的。不明白倒底問題出在哪里。只有這么多分了。望指教

本來以為是代碼有問題，看Firebug沒有報錯，并且觀察Firebug確實從服務端取得了數(shù)據(jù)。搞了很久沒有想出問題，但是什么也不干，把窗口最小化再最大化的時候，數(shù)據(jù)又出來了?。?！
這可能是Extjs的一個Bug，從網(wǎng)上找類似的解決方法，找到了這個：
，后來又和qiuye402大俠進行了溝通終于搞定。

其實就是布局刷新的問題，只需將最外層的容器重新render一下就可以了。最外層的容器一般就是類似于viewport的東東了，剛開始不知道，一直重新render包含grid的panel，沒有效果，重新render viewport一切OK了！

最新評論