javascript Sencha Touch：列出 ItemTap 事件触发
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/4309744/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Sencha Touch: List ItemTap Event Firing
提问by Michael Wales
I am following along very closely with the code within the GeoCongress.us App, as this is my first Sencha Touch app and the premise behind that app's layout functionality is similar to what I hope to achieve.
我正在密切关注GeoCongress.us App 中的代码，因为这是我的第一个 Sencha Touch 应用程序，该应用程序的布局功能背后的前提与我希望实现的类似。
I am having an issue getting a List object to respond to the itemtapevent though. My intent is to capture the itemtapevent at the SetsScreenlevel, fire my own custom event which my Appobject would listen for, and Appcould then handle the process of displaying a new card (based on the item tapped).
我在获取 List 对象以响应itemtap事件时遇到问题。我的目的是itemtap在SetsScreen关卡中捕获事件，触发我自己的App对象将侦听的自定义事件，然后App可以处理显示新卡片的过程（基于点击的项目）。
First, the SetsScreenobject (relevant portions of it at least):
首先，SetsScreen对象（至少是它的相关部分）：
DataSets.views.SetsScreen = Ext.extend(Ext.Panel, {
cls: 'sets-screen',
layout: 'card',
initComponent: function() {
// Build the main content list and add it to the main scren
this.setsList = new DataSets.views.SetsList({
scroll: false
});
this.setsList.on('itemtap', this.onListItemTap, this);
this.main = new Ext.Container({
scroll: true,
items: [this.setsList]
});
this.items = [this.main];
DataSets.views.SetsScreen.superclass.initComponent.call(this);
},
onListItemTap: function(dv, index, item, e) {
alert('Test');
}
});
Here is my SetsListobject (nothing really amazing here):
这是我的SetsList对象（这里没什么了不起的）：
DataSets.views.SetsList = Ext.extend(Ext.List, {
itemSelector: '.sets-list-item',
singleSelect: true,
initComponent: function() {
this.store = DataSets.stores.Sets;
this.itemTpl = Ext.XTemplate.from('sets-list');
DataSets.views.SetsList.superclass.initComponent.call(this);
}
});
And the Setsobject is nothing more than a quick data model and Ext.data.Store:
而Sets对象无非是一个快速的数据模型和 Ext.data.Store：
Ext.regModel('Sets', {
idProperty: 'id',
fields: [
'title',
'last_updated',
'current_value'
]
});
DataSets.stores.Sets = new Ext.data.Store({
model: 'Sets',
data: [
{id: 0, title: 'Weight', last_updated: new Date('11/28/2010 00:00:00 AM GMT-0600'), current_value: 145},
{id: 1, title: 'Cups of Coffee', last_updated: new Date('11/28/2010 07:00:00 AM GMT-0600'), current_value: 1}
]
});
采纳答案by Michael Wales
Oh man - I don't know how I stumbled across this answer, a very obscure typo was the only thing preventing this from working.
哦，伙计 - 我不知道我是如何偶然发现这个答案的，一个非常模糊的错字是唯一阻止它工作的原因。
Ext.List()uses it's itemSelectorproperty to determine what element qualified for a "tap". My itemSelectorwas set to .sets-list-itembut the template had <div class="set-list-item">. Correcting the template and itemtapis firing as expected.
Ext.List()使用它的itemSelector属性来确定哪些元素有资格进行“点击”。我的itemSelector设置为，.sets-list-item但模板有<div class="set-list-item">. 更正模板并按itemtap预期触发。
回答by Michael Mullany
You might need to look at the updated screencast- since some of the API's changed in the 1.0 release and the older screencast is now out of synch.
您可能需要查看更新的截屏视频- 因为某些 API 在 1.0 版本中发生了变化，而旧的截屏视频现在不同步了。
