ExtJS-如何从Ext.panel.panel将工具提示设置为TAB

Question

我有一个Ext.Tab，Panel，其中有多个动态创建的选项卡。

每个选项卡都包含一个Ext.panel.panel。我需要做的是在选项卡上添加一个工具提示。我试图做这样的事情：

Ext.define('XXX.XXX.XXX.MyCustomPanel', {
extend: 'Ext.panel.Panel',
setTabTitle: function() {
    title = 'some title';
  try {
    this.setTitle(title);
    this.getHeader().getEl().set({
        'data-qtip': title
    });
  } catch (e) {
  }
}

尽管如此，选项卡不是标题，因此它不会将工具提示应用于选项卡

任何想法

编辑：

还找到了另一种方法：

this.tab.setTooltip('tool tip');

谢谢，

Answer 1

每个选项卡按钮都是Ext.tab.Tab类的实例。在选项卡面板中创建新面板时，可以通过tabConfig选项指定选项卡按钮的配置。

因此，在选项卡配置选项中，您可以通过以下方式轻松指定选项卡工具提示：

    tabConfig: {                    
        tooltip: 'Tooltip text'
    }  

这段代码创建了新的Ext.Tab.Panel，其中有两个选项卡定义了工具提示，并动态创建了第三个也有工具提示的选项卡：

   var tabPanel = Ext.create('Ext.tab.Panel', {
        width: 400,
        height: 400,
        renderTo: Ext.getBody(),
        items: [{
            title: 'Foo',
            tabConfig: {                    
                tooltip: 'A Foo tab tooltip'
            }                
        }, {
            title: 'Bar',
            tabConfig: {                    
                tooltip: 'A Bar tab tooltip'
            }
        }]
    });
    var dynamiclyCreatedTab = Ext.create('Ext.panel.Panel',{
       tabConfig: {
           title: 'Dynamicly created tab',
           tooltip: 'A Dynamicly created tab tooltip'
       } 
    });
    tabPanel.add(dynamiclyCreatedTab);

参见小提琴：https://fiddle.sencha.com/#fiddle/1q8