列标题中有省略号时的 ExtJS 工具提示

【问题标题】：ExtJS tooltip when there is an ellipsis in the column header列标题中有省略号时的 ExtJS 工具提示
【发布时间】：2021-01-20 13:26:47
【问题描述】：

我需要用省略号在列标题中显示一个工具提示。方法是溢出，不工作，因为我的标题el.scrollWidth = el.offsetWidth

isOverflow: function (el) {
        return el.scrollWidth > el.offsetWidth;
    },

【问题讨论】：

标签： extjs header grid tooltip ellipsis

【解决方案1】：

我通常在调整列大小时这样做：

listeners:{
    columnResize: {
        fn: function (ct, column, width, eOpts){   
                 //check overflow
                 if (column.textEl.dom.offsetWidth<column.textInnerEl.dom.offsetWidth-5){
                     var tip = Ext.create('Ext.tip.ToolTip', {
                                    target: column.titleEl.dom,
                                    html: column.text,
                                    autoDestroy: true
                               });
                      column.tooltip = tip;

                 } else {
                      //Remove when title visible
                      if (column.tooltip!=null)
                             column.tooltip.destroy();
                            
                 }
             }
        }
   }

【讨论】：