Question

我正在尝试使用sencha touch 2.3在Ext.dataview.component.ListItem（使用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本身可能？但这应该会有效。

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

1 个答案: