如何给extjs按钮添加data-属性

Question

我想在创建时向 extjs 按钮添加一个 data- 属性。我使用了 setAttributes 方法，但我不想使用 setAttributes 方法。应该像其他配置选项一样添加 data- 属性。

Answer 1

您可以使用

autoEl

属性，例如：

{
  xtype: 'button',
  text: 'Button',
  autoEl: {
    'data-attribute': 'foobar'
  }
}

工作示例：https://fiddle.sencha.com/#fiddle/1d0d

Answer 2

在按钮监听器中添加以下代码片段

afterrender:function(button){
         button.getEl().set({
         "data-id": "some text"
         });  
    }

Answer 3

{
    xtype: '按钮',
    文本：“按钮”，
    aria 属性：{
        'aria-test-id': 'foobar',
        'data-test-id': 'foobar' // 看起来任何属性都可以通过这种方式插入
    }
}

Answer 4

您可以像这样添加自己的数据属性：

var button = new Ext.button.Button({
id: 'mybutton',
text: 'Click me',
'data-attribute': data,
handler: function() {
    alert('You clicked the button!');
}
});