sencha touch2 - 给container 添加tap 事件
背景：在ST中有时候我们需要让不同container组成一个模版。然而我们需要点击某个container时候我们就需要触发事件。但是在container里面是没有tap这个事件的。我们需要手工去去添加注册这个事件。并且你可以选择任意的container注册事件。有两种方法可以注册事件
参考国外一个帖子：
How to set element listeners
container.js
Ext.define('DingCan.view.component.HomeItem', {
extend : 'Ext.Container',
xtype : 'homeitem',
requires : ['Ext.Label'],
config : {
// 此处的fullscreen要慎用。不然dataview不能显示
// fullscreen : true,
layout : 'hbox',
//方法一：这个地方可以直接给container注册一个事件。确定就是I不便于mvc模式维护
/*listeners : {
tap : {
fn : function() {
console.log('This component was tapped...');
},
element : 'element'
}
},*/
items : [{
itemId : 'image',
xtype : 'image',
mode : 'tag',
src : '',
height: 57,
width: 57
}, {
style:{'padding-left': '10px'},
//在initiate函数中会通过这个id来查找到
itemId:'homelistitem',
xtype : 'container',
layout : 'vbox',
items : [{
itemId : 'name',
searchstr : '',
html : ''
}, {
itemId : 'listdes',
html : ''
}]
}]
},
initialize : function() {
this.callParent(arguments);
//方法二：我们通过找到你需要注册的container的itemId属性找到。然后给他手工注册一个tap事件。这种方法有助于用MVC模式编程
//给container加一个tap事件
var me = this;
//找到自己的container
var someItem = this.down('#homelistitem');
//添加tap事件
someItem.element.on({
scope : me,
//注意这个地方tap事件
tap : function(e, t) {
//里面的函数tapItem函数可以自定义。也就是你才controller里面需要重写的一个函数
someItem.fireEvent('tapItem', me, e, t)
}
})
},
beforeInitialize : function() {
this.imageEl = this.down('#image');
this.nameEl = this.down('#name');
this.listdesEl = this.down('#listdes')
},
setImage : function(image) {
this.imageEl.setSrc(image)
},
setName : function(name) {
this.nameEl.setHtml(name)
},
setSearchstr : function(searchstr){
this.nameEl.searchstr = searchstr
},
setListdes : function(listdes) {
this.listdesEl.setHtml(listdes)
}
})
contoller 的调用
Ext.define('DingCan.controller.SelectStuff', {
extend : 'Ext.app.Controller',
config : {
refs : {
homeList : 'container[itemId="homelistitem"]'
},
control : {
homeList : {
//重写tapitem这个函数
tapItem:'tapHomeList'
},
}
},
//点击container时候会执行此函数
tapHomeList:function(me,e,t){
console.log('tapped me');
},
})
补充：web前端 , JavaScript ,
