[Component] [table-column] Problems occur when el-table-column uses show-overflow-tooltip contain el-input

[xuyimingwork]

Bug Type: Component

Environment

• Vue Version: 3.4.26
• Element Plus Version: 2.7.2
• Browser / OS: any
• Build Tool: Vite

Reproduction

Related Component

• el-table-column

Reproduction Link

Element Plus Playground

Steps to reproduce

打开复现链接，将鼠标移至表格 name 列的 cell 上

What is Expected?

• tooltip 内展示 el-input 中的值
• 或者不展示 tooltip

What is actually happening?

展示了没有内容的 tooltip 小黑块

Additional comments

el-input 元素不存在 innerText 和 textContent，因此 tooltip 展示内容为空。内容为空时的 tooltip 表现形式让人疑惑。
这会影响到如 el-cascader 等包含 el-input 的组件在表格列中的显示。
感觉可以先在 innerText 与 textContent 没值时禁用 tooltip 的展示。

[warmthsea]

建议根据 input 的值手动控制 tooltip 的展示

[xuyimingwork]

建议根据 input 的值手动控制 tooltip 的展示

当前的 tooltip 没法依据单个 cell 的内容来控制显示隐藏。

• 可能可以在 el-input 内添加一个 display: none 的 div 来表示 el-input 的 value 值？这样就能取到 innerText 了，但是这样影响会比较大，可能不是一个好方案。
  • 比如 el-select 在单选情况下 input 值没有，innerText 就没有，而在多选情况下，因为用 tag 表示值，所以 innerText 有值，就能展示
• 另一个比较简单的解决方式就是在渲染 cell 的 tooltip 时将 innerText 为空的 tooltip 添加 disabled 属性，因为为空情况下也没有显示 tooltip 的意义。