Sencha - 向元素添加自定义属性

Question

我希望我的 div 看起来像这样

<div id="example" customAtt="try"></div>

如何在sencha中向面板、按钮等添加自定义属性？

谢谢你

Answer 1

您可以在经典框架中使用autoEl：

Ext.create({
    xtype: 'component',
    renderTo: Ext.getBody(),
    html: 'Hi !!!',
    id: "example",
    autoEl: {
        customAtt: "try"
    }
});

板条箱...

<div class="x-component x-component-default x-border-box" customatt="try" id="example">Hi !!!</div>

Answer 2

如果是Ext.Component，可以进行以下操作

listeners: {
    afterrender: function (component) {
        component.getEl().dom.setAttribute("myCustomAttribute", "SOME_VALUE");
    }
}

Answer 3

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

Answer 4

您可以轻松添加自定义属性，就像定义配置属性一样。

    mycont = {
        xtype: 'container',
        id: 'cont123',
        width: 300,
        height: 100,
        customAttribute1: customAttribute1Value
        customAttribute2: customAttribute2Value
        ...
    }