button - 溢出按钮上的 Extjs 工具提示

Question

我正在尝试在 extjs 溢出按钮上添加工具提示，但我找不到这样做的方法。文档中也没有提到它。有没有人能够做到这一点？或者更改按钮的文本

我发现

overflowText: 'More >'

但这似乎不起作用

Answer 1

afterrender您可以在工具栏事件期间向溢出按钮添加工具提示。目标元素将this.layout.overflowHandler.menuTrigger.el在afterrender事件中。

工作的jsFiddle http://jsfiddle.net/gJjTY/（溢出图标在工具栏的右下角，由于缺少css，图标没有呈现）

Ext.create('Ext.toolbar.Toolbar', {
    renderTo: document.body,
    width   : 300,
    margin  : '5 0 0 0',
    layout  : {overflowHandler: 'Menu' },
    items   : [
        {
            text   : 'This is a Button',
            tooltip: 'This is a tip',
        },
        {
            text   : 'This is another button',
        },
        {
            text : "this is yet another button!"
        }
    ],
    listeners: {
        afterrender: function(view){
            var me = this;
            console.log(me);
            Ext.Function.defer(function(){
                Ext.create('Ext.tip.ToolTip', {
                    target       : me.layout.overflowHandler.menuTrigger.el,
                    anchor       : 'left',
                    dismissDelay : 0,
                    showDelay    : 0,
                    autoHide     : true,
                    html         : "This is a tooltip!"
                });
            }, 100);
        }
    }
});

Ext.onReady(function(){
    Ext.QuickTips.interceptTitles = true;
    Ext.QuickTips.init();
});