ExtJS:按钮,动作为json格式

时间:2014-08-21 05:44:54

标签: javascript json extjs

如何使用操作创建x-type按钮:

为了创建一些小部件我们使用Json文件来构建它。 如果我写这样的东西,sencha ext js就可以在这个json上运行,并且会按照我的预期生成。

"editViewFields": [
                    {
                        "xtype": "textfield",
                        "name": "text1",
                        "fieldLabel": "Text 1 : "
                    },
                    {
                        "xtype": "button",
                        "text": "name",
                        "width": 75
                    }
                  ]

它将生成一个文本字段和按钮。

现在我想用动作创建按钮,

 text : 'Button',
    renderTo : Ext.getBody(),
    listeners: {
        click: function() {
            // this == the button, as we are in the local scope
            this.setText('I was clicked!');
        }
    }

有些事这样我试过但没有工作:

            {
                "xtype": "button",
                "text": "name",
                "width": 75,
                "enableToggle": true,
                "listeners": {
                    "click": {
                        "this.setText": "(I was clicked!)"
                    }
                }
            }

请提供您有关的所有宝贵信息。

2 个答案:

答案 0 :(得分:1)

您的侦听器配置看起来不正确。它应该看起来像这样

{
    xtype: 'button',
    text: 'Click me!',                

    listeners: {
        "click": function(btn){
            btn.setText('I was clicked!');
        }
    }        
}

这是一个小提琴:https://fiddle.sencha.com/#fiddle/97q

这里还有一个指向侦听器doc的链接以及另一种配置它的方法http://docs.sencha.com/extjs/5.0/apidocs/#!/api/Ext.button.Button-cfg-listeners

答案 1 :(得分:1)

尝试使用"处理程序"如下所示配置 JSFIDDLE

Ext.onReady(function () {
    var myButton = Ext.create("Ext.button.Button", {
        "text": "name",
        "width": 75,
        "enableToggle": true,
        "handler": function (button, options) {
            button.setText("I was clicked!");        
        },
        "renderTo": Ext.getBody()
    });
});

所以你的代码就像,

{
    "xtype": "button",
    "text": "name",
    "width": 75,
    "enableToggle": true,
    "handler": function (button, options) {
        button.setText("I was clicked!");        
    }
}