如何在 ExtJs 中将标题项向右对齐

Posted 2023-02-26

【中文标题】如何在 ExtJs 中将标题项向右对齐

【英文标题】：How to align header items to the right in ExtJs

【发布时间】：2014-02-05 13:56:25

【问题描述】：

这是我的标题和它的项目；如您所见，我尝试添加 style 属性，但无济于事 - 链接仍左对齐，而我希望它右对齐：

items: [

    region: 'north',
    xtype: 'header',
    items:[
        
            xtype: 'component',
            autoEl: 
                html: '<a href="#">View All Services</a>'
            ,
            style: 
                textAlign: 'right',
                left: 'auto',
                right: '0'
            ,
            listeners: 
                render: function(component) 
                    component.getEl().on('click', function(e) 
                        alert('test');
                    );
                
            
        
    ],
    padding: 6

如何将我的项目与标题中的右侧对齐？

【参考方案1】：

将标头titlePosition 配置属性设置为0。默认情况下，标题组件中的项目添加在 标题标题之前。如果您将titlePosition config 设置为0，项目将添加到 title:

items: [

    region: 'north',
    xtype: 'header',
    titlePosition: 0,
    items:[
        
            xtype: 'component',
            autoEl: 
                html: '<a href="#">View All Services</a>'
            ,
            listeners: 
                render: function(component) 
                    component.getEl().on('click', function(e) 
                        alert('test');
                    );
                
            
        
    ],
    padding: 6

【讨论】：

谢谢，我打算试试，但我在configsdocs.sencha.com/extjs/4.0.7/#!/api/Ext.panel.Header 上没有看到它