ExtJs在页面上window再调用Window的事件处理

Posted 2020-09-29 书未来

今天在开发Ext的过程中遇到了一个恶心的问题，就是在ext.window页面，点击再次弹出window时，gridpanel中的store数据加载异常，不能正常被加载，会出现缓存，出现该问题，是因为window窗口弹出时，两个window同时存在，并且在两个window交替使用时，需要先将一个窗口关闭，关闭时，会对window的缓存进行清理，这样就能保证store数据的正确加载。分享给大家，供参考。

var actInfoWindow2;
function showCallFlowInfoWindow(flowid, actId) {
	var actWindowHeight1 = window.innerHeight
	|| document.documentElement.clientHeight
	|| document.body.clientHeight;
	if(null != upldWin && undefined != upldWin && "" != upldWin){
		upldWin.close();
	}
	// 异常活动模型
	Ext.define(‘callFlowModel‘, {
		extend: ‘Ext.data.Model‘,
        fields: [{name: ‘instance‘,  type: ‘string‘},
                 {name: ‘flowName‘,  type: ‘string‘},
                 {name: ‘prjName‘,  type: ‘string‘},
                 {name: ‘startTime‘,   type: ‘String‘}]
	});
	
	callFlowStore = Ext.create(‘Ext.data.Store‘, {
		autoLoad : true,
		model : ‘callFlowModel‘,
		proxy : {
			type : ‘ajax‘,
			url : ‘subflow.do‘,
			reader : {
				type : ‘json‘,
				root : ‘callFlowList‘,
				totalProperty : ‘total‘
			}
		},   
	    listeners: {  
	        ‘beforeload‘: function (store, op, options) {
	            var params = {  
	                //参数  
            		flowId : flowid,
            	    id : actId
	            };  
	            Ext.apply(store.proxy.extraParams, params);   
	        }  
	    }  
	});
	
	// 绑定数据模型flowColumns
	var callFlowColumns = [
    	{ text: ‘实例名‘,  dataIndex: ‘instance‘, width:174 },
    	{ text: ‘工程名‘,  dataIndex: ‘prjName‘,width: 174 },
    	{ text: ‘工作流名‘,  dataIndex: ‘flowName‘,width: 174 },
    	{ text: ‘启动时间‘,  dataIndex: ‘startTime‘,width: 174 }
   ];

	callFlowGrid = Ext.create(‘Ext.grid.Panel‘, {
		region : ‘center‘,
		//tbar:querybar,
		id:‘callFlowList‘,
		autoScroll : false,
		border:false,
		//columnLines : true,
		//selModel:selModel,
		//bbar : pageBar,
		columns : callFlowColumns,
		store : callFlowStore,
		loadMask : {
			msg : " 数据加载中，请稍等 "
		}
	});
	
	if (actInfoWindow2 == undefined || !actInfoWindow2.isVisible()) {
		actInfoWindow2 = Ext.create(‘Ext.window.Window‘, {
			id : ‘actInfoWindow2‘,
			title : ‘活动信息详情‘,
			modal : true,
			closeAction : ‘destroy‘,
			constrain : true,
			autoScroll : true,
			width : 700,
			height : actWindowHeight1 - 300,
			items : [ callFlowGrid ],
			listeners:{
			      beforeclose:function(){
			    	  actInfoWindow2.destroy();
			      }
			}
		});
	}
	actInfoWindow2.show();
}

if(null != upldWin && undefined != upldWin && "" != upldWin){

   upldWin.close();

}

我的问题出现就是因为没有添加上面黄色背景的代码片段导致的错误。供大家参考。两个window交替使用时，需要交替关闭，这样才能保证页面的正常。ExtJs不建议弹出多window同时使用，当然，如果能解决好ExtJs之间的数据交互，也未必不可以。