如何访问 Sencha touch List Row 索引、检索值并应用更改？

Question

如果我需要为列表中的行提供备用背景颜色，我就会陷入 sencha touch 列表中。还有一个疑问如何在 sencha touch 中自定义列表，因为我需要在列表行中添加文本字段、按钮、图像。我用 html 尝试过，并且能够做到，有什么方法可以直接将 sencha 触摸对象项添加到列表中。请帮助我解决这个问题。

Answer 1

您可以使用 cls : 'customCls' 一个可选的额外 CSS 类，它将添加到此组件的元素（默认为 ''）。这对于使用标准 CSS 规则向组件或其任何子组件添加自定义样式非常有用。也许你想看看这个

编辑：

Ext.regModel('Contact', {
    fields: ['firstName', 'lastName']
});

var store = new Ext.data.JsonStore({
    model  : 'Contact',
    sorters: 'lastName',
    getGroupString : function(record) {
    return record.get('lastName')[0];
    },
    data: [
        {firstName: 'Tommy',   lastName: 'Maintz'},
        {firstName: 'Rob',     lastName: 'Dougan'},
        {firstName: 'Ed',      lastName: 'Spencer'},
        {firstName: 'Jamie',   lastName: 'Avins'},
        {firstName: 'Aaron',   lastName: 'Conran'},
        {firstName: 'Dave',    lastName: 'Kaneda'},
        {firstName: 'Michael', lastName: 'Mullany'},
        {firstName: 'Abraham', lastName: 'Elias'},
        {firstName: 'Jay',     lastName: 'Robinson'}
    ]
});

Ext.onReady(function() {
    var list = new Ext.List({
        fullscreen: true,
        itemTpl : '{firstName} {lastName}',
        grouped : true,
        indexBar: true,
        store: store,
        listeners: {  // here you can add itemtap event and retrieve index number!
            itemtap:function(item,index, e){

                console.log(index);
                //so, now that you have index , you can access specific item
                console.log(this.store.data.items[index]);      
        }   
    },
    });

    list.show();

    console.log(list.getStore().data.items[0]); 
    // here you are accessing list store and then store data and then store item with index 0
});