ExtJS为组件添加事件监听

黄晶谛

于 2021-01-02 12:24:13 发布

阅读量1.5k

点赞数

分类专栏： # ExtJS

本文链接：https://blog.csdn.net/SUNBOYmxbsH/article/details/112094851

版权

ExtJS 专栏收录该内容

16 篇文章 1 订阅

订阅专栏

利用ExtJS为组件添加事件监听有两种方式，一是在组件内部通过listener配置添加事件监听，二是使用组件的引用为组件绑定事件。

在组件内部通过listener配置添加事件监听

Ext.onReady(function(){
 	var win = Ext.create('Ext.window.Window', {
 		title:'UI组件事件',
 		width:500,
 		height:400,
 		renderTo:Ext.getBody(),
 		listeners:{
 			show : function(){
 				alert('show execute...');
 			},
 			render : function(){
 				alert('render execute...');
 			},
 			close : function(){
 				alert('close execute...');
 			},
 			click : {
 				element:'body',
 				fn:function(){
 					alert('click body...');
 				}
 			}
 		}
 	});
 	
 	win.show();
}

使用组件的引用为组件绑定事件

Ext.onReady(function(){
 	var win = Ext.create('Ext.window.Window', {
 		title:'UI组件事件',
 		width:500,
 		height:400,
 		renderTo:Ext.getBody()
 	});
 	
// 	win.on('show', function(){
// 		alert('show ...');
// 	});
// 	
// 	win.on('close', function(){
// 		alert('close ...');
// 	});
 	
 	win.on({
 		'show':{
 			fn:function(){
 				alert('show ...');
 			},
 			scope: this
 		},
 		'close':{
 			fn:function(){
 				alert('close ...');
 			}
 		}
 	});
 	
 	win.show();
 	
 });