gridpanel要显示，当调整窗口大小时才显示

我想做出的效果是单击左边的数节点，通过json返回数据，在tabpanel中的gridpanel显示加载json data
我这样做了，但grid不能显示，只有调整窗口大小时才显示。
不知道有没有更好的方法。谢谢

<script type="text/javascript">
function reloadGrid(){
	var ds = new Ext.data.Store({
		autoLoad:true,
		proxy : new Ext.data.HttpProxy({url:'__APP__/Admin/user/'}),
		reader: new Ext.data.JsonReader({
			root: 'topics',
			totalProperty: 'totalCount',
			id: 'uid'
		},[
			'uid','account','password','gid'
		])
	});
	var sm = new Ext.grid.CheckboxSelectionModel();
	var colModel = new Ext.grid.ColumnModel([
		new Ext.grid.RowNumberer(),
		sm,
		{header:'ID',width:50,sortable:true,dataIndex:'uid'},
		{header:'用户名', width:300,sortable:true,dataIndex:'account'},
		{header:'密码', width:150,sortable:true,dataIndex:'password'},
		{header:'用户组',width:100,sortable:true,dataIndex:'gid'},
	]);
	
	var grid = new Ext.grid.GridPanel({
		border:false,
		buttonAlign :'left',
		region:'center',
		loadMask: true,
		store: ds,
		cm: colModel,
		sm: sm,
		autoScroll: true,
		bbar: new Ext.PagingToolbar({
			pageSize: 20,
			store: ds,
			displayInfo: true,
			displayMsg: '第{0} 到 {1} 条数据 共{2}条',
			emptyMsg: "没有数据"
		})
	}).show();
	ds.load({params:{start:0, limit:20, forumId: 4}});
	alert('no');
	return grid;
}
/*var viewport = new Ext.Viewport({
    layout:'border',
    items:[grid]
});*/
//ds.load({params:{start:0, limit:20, forumId: 4}});
function treeClick(node,e) {
    if(node.isLeaf()){
    e.stopEvent();
    var n = tab.getComponent(node.id);
    if (!n) {
        var n = tab.add({
            'id' : node.id,
            'title' : node.text,
            closable:true,
            //html : '__APP__/Public/treedata/',
			items:[reloadGrid()],
			/*autoLoad : {
				url : '__APP__/' + node.attributes.model + '/' + node.attributes.action + '/',  
				scripts : true  
			},*/
			//autoLoad:'__APP__/' + node.attributes.model + '/' + node.attributes.action + '/'
        });
    }
    tab.setActiveTab(n);
    }
}
var tab = new Ext.TabPanel({
	region:'center',
	deferredRender:false,
	activeTab:0,
	resizeTabs:true, // turn on tab resizing
	minTabWidth: 115,
	tabWidth:135,
	enableTabScroll:true,
});

Ext.onReady(function(){

//生成标签页
   //layout
   var viewport = new Ext.Viewport({
		layout:'border',
		items:[
			new Ext.BoxComponent({
				region:'north',
				el: 'north',
				height:80
			}),new Ext.BoxComponent({
				region:'south',
				el: 'south',
				height:25
			}),{
			region:'west',
			id:'west-panel',
			split:true,
			width: 200,
			minSize: 175,
			maxSize: 400,
			margins:'0 0 0 0',
			layout:'accordion',
			title:'系统菜单',
			collapsible :true,
			layoutConfig:{
				animate:true
				},
		    items: [
			    {
					title:'EXT控件使用',
					border:false,
					html:'<div id="tree-div" style="overflow:auto;width:100%;height:100%"></div>'
					//iconCls:'nav'
			    },{
					title:'信息中心',
					border:false,
					//iconCls:'settings',
					html:'<div id="tree" style="overflow:auto;width:100%;height:100%"></div>'
			    }]
			},
	        tab//初始标签页
		 ]
	});

	//设置树形面板
	var Tree = Ext.tree;
	// set the root node
	var root = new Tree.AsyncTreeNode({
		text: 'Ext JS',
		draggable:false,
		id:'root'
	});

	var tree = new Tree.TreePanel({
		el:'tree-div',
		autoScroll:true,
		root:root,
		animate:true,
		enableDD:false,
		border:false,
		rootVisible:false,
		containerScroll: true,
		loader: new Tree.TreeLoader({
			dataUrl:'__APP__/Public/treedata/'
		})
	});

    tree.setRootNode(root);
	// render the tree
	tree.render();
	root.expand();
	tree.on('click',treeClick);

    //tree2
    var root2=new Ext.tree.TreeNode({
		    id:"root2",
		    text:"树的根"
		});

    var c1=new Ext.tree.TreeNode({
		id:'c1',
		icon:'img/im2.gif',
		text:'信息征集'
	});

    var c2=new Ext.tree.TreeNode({
		id:'c2',
		icon:'img/im2.gif',
		text:'bug征集'
	});


    var c22=new Ext.tree.TreeNode({
		id:'c22',
		icon:'img/im2.gif',
		text:'实例征集'
	});

    var c3=new Ext.tree.TreeNode({
		id:'c3',
		icon:'img/im2.gif',
		text:'给我留言'
	});

    var c4=new Ext.tree.TreeNode({
		id:'c4',
		icon:'img/im2.gif',
		text:'留言列表'
	});

	var c5=new Ext.tree.TreeNode({
		id:'c5',
		text:'更新公告'
	});

    var root3=new Ext.tree.TreeNode({
		    id:"root3",
		    text:"根"
		});
	c1.appendChild(c2);
    c1.appendChild(c22);
	root2.appendChild(c1);
    root2.appendChild(c3);
    root2.appendChild(c4);
    root3.appendChild(c5);

	var tree2=new Ext.tree.TreePanel({
		renderTo:"tree",
		root:root2,
		animate:true,
		enableDD:false,
		border:false,
		rootVisible:false,
		containerScroll: true
	});

	//end loding
	setTimeout(
				function() {
					Ext.get('loading').remove();
					Ext.get('loading-mask').fadeOut({remove:true});
				}, 250
			  );
});
</script>
<!--<div id="header"><h1>福州鹏飞信息技术有限公司</h1></div>