android - sencha Ext.List 组件中的单击事件

Question

我使用 sencha touch 2 创建了列表。

var aroundList = Ext.create('Ext.List', {
    itemCls : 'my-dataview-item',
    id : 'aroundMeList',
    itemTpl : '<div><img style="padding:1px; border-style:solid; border-width:1px; border-color:{trustColor}" src="' + localStorage.httpServerPrefix + '{imageURI}"/><span id="name">{fullname}</span><span id="time">{time}</span><p id="msg">{text}<span id="count">&nbsp;{replyCount}&nbsp;</span></p><p id="dist">&nbsp;< '+localStorage.radius+''+localStorage.unit+' '+'&nbsp;</p></div>',
    store : aroundStore,
    listeners : {
        select : {
            fn : this.onMessageClickedInAround,
            scope : this
        }
    }
});

我得到这样的输出（不完全是，但是，像这样）

当用户单击列表中的第一行或第一项时，我正在调用 onMessageClickedInAround 方法（此方法用于显示来自该用户的消息），您可以看到上面的代码。

现在我有一个要求，当用户单击列表中的任何图片时，我需要显示相应的个人资料页面（即一个用户可以通过单击列表中的图像查看其他人的个人资料），有什么办法可以做这 ？

Answer 1

您应该为此使用事件委托

更新

var aroundList = Ext.create('Ext.List', {
    // rest of your cfg
    listeners : {
        // other listeners
        tap: {
            fn: yourHandler,
            element: 'element',
            delegate: 'img'
        }
    }
});

如前所述，以下内容已过时

var aroundList = Ext.create('Ext.List', {
    // rest of your cfg
    listeners : {
        // other listeners
        el: {
            tap: yourHandler,
            delegate: 'img'
        }
    }
});

Answer 2

如果您的列表由数据源填充，则 sencha touch 会将相应的记录传递给您的 itemTap 侦听器。您可以按照以下方式执行此操作。

    listeners : {
        itemtap: function (list, index, item, record) {
            // Show next view based on current record
        }
    }

如果您只想在图像点击上执行此操作，则可以检查该侦听器中的事件。

    listeners : {
        itemtap: function (list, index, item, record, senchaEvent) {
            if (senchaEvent.event.target.nodeName === 'img') {
                // Show next view
            }
        }
    }

您也可以上课<img>并检查。