extjs - extjs 中面板的工具提示

Question

我正在将面板动态添加到容器中。我想在悬停时为此面板设置一个工具提示。怎么做？

var myPanel = Ext.create('myClass.extending panel');
myPanel.id = 'my-id';
myPanel.setTitle('myTitle');              
myPanel.collapsed = true;
this.add(myPanel);

更新：我也尝试过，但没有工作

var panelToolTip = Ext.create('Ext.tip.ToolTip', {
        target: 'my-id',
        html: 'I am a tooltip on your panel.'
});
this.add(panelToolTip);

Answer 1

我通过在面板扩展类上添加以下代码解决了这个问题。

    listeners: {
    render: function () {
        this.getEl().dom.title = 'my custom tool tip';
    }
}

Answer 2

以下代码段将工具提示添加到指定的 id。

编辑：这是我的面板代码，用 Firefox 测试过。

    var myPanel = Ext.create('Ext.panel.Panel', {
     id : 'myPanel',
                    width: 200,
                    height: 150,
                    title: 'Panels are cool',
                    collapsible: true,
                    renderTo: Ext.getBody(),
                    .. .some other properties
});
 var tip = Ext.create('Ext.tip.ToolTip', {
                target: 'myPanel',
                html: 'I am a tooltip on myPanel'
            });

Answer 3

当您想显示两个单独的工具提示时，您可以使用以下方式。

listeners: {
"collapse": function () {
    this.getEl().dom.title = 'collapse tooltip';
},
"expand": function () {
    this.getEl().dom.title = 'expand tooltip';
}
},