Extjs 如何在sencha touch中设置按钮的点击侦听器?

Extjs 如何在sencha touch中设置按钮的点击侦听器?,extjs,sencha-touch-2,Extjs,Sencha Touch 2,我在Sencha touch中有4个按钮。每个按钮的文本都是投票。我希望当用户点击任何按钮时,相应按钮的文本应更改为“投票”。我想以最好的方式在控制器中编写所有这些代码 代码: buttons.js items: [ { xtype:'button', text:"Item1", cls:'items' }, xtype:'button', text:"Item2", cls:'items' }, xtype

我在Sencha touch中有4个按钮。每个按钮的文本都是投票。我希望当用户点击任何按钮时,相应按钮的文本应更改为“投票”。我想以最好的方式在控制器中编写所有这些代码

代码:

buttons.js

items:
[
 {
     xtype:'button',
     text:"Item1",
     cls:'items'

  },

     xtype:'button',
     text:"Item2",
     cls:'items'

  },

     xtype:'button',
     text:"Item3",
     cls:'items'

  },

     xtype:'button',
     text:"Item4",
     cls:'items'

  },

]
Controller.js

control:
 {
   button:
     {
       tap:'OnButtonTap'
     }
 }
   OnButtonTap()
    {
      //how to get value of clicked button here
    }

您应该为所有按钮分配一个唯一的Id,然后编写以下代码来更改按钮的文本

在Sencha Touch中,必须将函数编写为onButtonTap:function(){}

代码:

OnButtonTap:function(button)
{
    Ext.getCmp(button.id).setText('Voted');
}

在上述功能中,“按钮”是您单击的对象,您可以访问所有sencha触摸按钮方法。

请查看。回调函数中的第一个参数是点击的按钮。它可以用于即时操作。在fiddle.sencha.com上看看这个

使用控制器和视图设置app.js

Ext.application({
    name : 'Fiddle',

    controllers: [
        'ButtonsController'
    ],

    views: [
        'ButtonsView'
    ],

    launch : function() {
        Ext.Viewport.add(Ext.create('Fiddle.view.ButtonsView'));
    }
});
控制器引用按钮并在已点击的按钮上设置新文本

Ext.define('Fiddle.controller.ButtonsController', {
    extend: 'Ext.app.Controller',

    config: {
        refs: {
            button: 'buttonsview button'
        },
        control: {
            button: {
                tap: 'onButtonTap'
            }
        }
    },

    onButtonTap: function(button) {
        button.setText('Voted');
    }
});
视图包含按钮。默认配置也很方便

Ext.define('Fiddle.view.ButtonsView', {
    extend: 'Ext.Container',
    xtype: 'buttonsview',

    config: {
        layout: 'vbox',
        defaults: {
            xtype: 'button',
            cls: 'items'
        },
        items: [
            { text: 'Item1' },
            { text: 'Item2' },
            { text: 'Item3' },
            { text: 'Item4' }
        ]
    }
});

首先在这里编写代码。!!!我已经更新了代码。。