js单行文本溢出显示省略号时才展示el-tooltip

 主要使用：
windicss的w-100限制宽度，并使用truncate溢出显示省略号
el-tooltip的:disabled属性控制el-tooltip气泡的显示隐藏

            
              

                
                  
{{ item.label }}
                
              
            

 使用mouseover绑定事件toolTipVisibleChange

// 文本溢出展示el-tooltip
const isDisableTooltip = ref(true)
const toolTipVisibleChange = event => {
  const ev = event.target
  const evWeight = ev.scrollWidth

  const contentWeight = ev.clientWidth

  if (evWeight > contentWeight) {
    // 实际宽度 > 可视宽度  文字溢出
    isDisableTooltip.value = false
  } else {
    // 否则为不溢出
    isDisableTooltip.value = true
  }
}