javascript - Sencha 2.3 中使用架构师的 DataView 组件列表项

Question

我正在尝试使用Ext.dataview.component.ListItem在sencha touch 2.3(使用sencha架构师)中构建一个列表。我能够使用 updateRecord 方法从商店获取值，但是我无法将其传递回主组件。

这就是我想要实现的目标:-

我想创建一个按钮列表，其文本将从商店动态显示，如果用户单击它，它应该显示带有年龄的警报。我有一家商店，里面有名字和年龄。我能够获取名称，但无法获取警报设置。我需要帮助-这是我的 dataView 类

Ext.define('MyListItem.view.MyListItem', {
extend: 'Ext.dataview.component.ListItem',
alias: 'widget.mylistitem',

requires: [
    'Ext.Button',
    'Ext.MessageBox'
],

config: {
    padding: 10,
    layout: 'hbox',
    items: [
        {
            xtype: 'button',
            handler: function(button, e) {
                var record = this.getRecord();
                console.log("buttonTapped");
                console.log(record);
                Ext.Msg.alert(
                record.get('name'), // the title of the alert
                "The age of this person is: " + record.get('age') // the message of the alert
                );
            },
            text: 'MyButton'
        },
        {
            xtype: 'component',
            flex: 1,
            html: 'Sample component inside dataitem'
        }
    ]
},

updateRecord: function(record) {
    // Provide an implementation to update this container's child items
    var me = this;
    me.down('button').setText(record.get('name'));
}

});

这是我的商店:-

Ext.define('MyListItem.store.MyDirectStore', {
extend: 'Ext.data.Store',

requires: [
    'MyListItem.model.MyModel'
],

config: {
    data: [
        {
            name: 'Adam',
            age: '28'
        },
        {
            name: 'Eve',
            age: '27'
        }
    ],
    model: 'MyListItem.model.MyModel',
    storeId: 'MyDirectStore'
}
});

Answer 1

我猜你的问题是你无法像使用 this.getRecord() 那样从处理函数中检索记录

您也可以使用年龄更新按钮，然后检索它以显示警报，例如:

{
    xtype: 'button',
    handler: function(button, e) {
        console.log("buttonTapped");
        Ext.Msg.alert(
            button.getText(), // the title of the alert
            "The age of this person is: " + button.getAge(); // the message of the alert
        );
    },
    text: 'MyButton',
    age: null
},

还有:

updateRecord: function(record) {
    // Provide an implementation to update this container's child items
    var button = this.down('button');
    button.setText(record.get('name'));
    button.setAge(record.get('age'));
}

更好的是，将信息或对记录的引用存储在更合适的位置，例如 ListItem 本身？但这应该可以正常工作。