Table scroll-x Big Bug?

Eacolt commented 6 months ago

Describe the bug

一直以来Table有个问题困扰我很久，就是我想让Column的宽度不写死，而是自适应其max-content最大宽度，然而我给Table设置了scroll-x = 'max-content'，以及max-height='300'，其中Column自定义渲染div上width:max-content, 结果会有意想不到的bug，横向滚动条无限延申，为什么？

如果不定Table的高度（去掉max-height='300')，那就没这个问题，可是我的需求要给Table高度，到底是什么原因呢？

以下是在线代码，顺便附上代码：

`

https://codesandbox.io/p/devbox/naiveui-table-bug-spyc63

Steps to reproduce

一直存在这个问题

Link to minimal reproduction

https://codesandbox.io/p/devbox/naiveui-table-bug-spyc63

System Info

System:
    OS: Windows 11 10.0.22631
    CPU: (20) x64 13th Gen Intel(R) Core(TM) i5-13500HX
    Memory: 3.27 GB / 15.73 GB
  Binaries:
    Node: 18.18.2 - C:\Program Files\nodejs\node.EXE
    npm: 9.8.1 - C:\Program Files\nodejs\npm.CMD
    pnpm: 8.12.1 - C:\Program Files\nodejs\pnpm.CMD
  Browsers:
    Edge: Chromium (123.0.2420.65)
    Internet Explorer: 11.0.22621.1

Used Package Manager

pnpm

Validations

[X] Read the Contributing Guidelines.
[X] Read the docs.
[X] Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
[X] Check that this is a concrete bug. For Q&A open a GitHub Discussion.
[X] The provided reproduction is a minimal reproducible example of the bug.

dellenshang commented 6 months ago

尝试了下也复现了，通过获取header的dom然后给宽度了就好了，但是发现scroll-x给个空字符串也行。

Eacolt commented 6 months ago

尝试了下也复现了，通过获取header的dom然后给宽度了就好了，但是发现scroll-x给个空字符串也行。

感谢您的回答，但是对我没有帮助，虽然看上去没问题了，但是max-content还是没效果，所有设置了width=max-content的列都被平分成一等分了，宽度都一样，那有的内容宽有的内容短就没意义了，根本原因就是设置了max-height，不加max-height就没问题

kagawagao commented 3 weeks ago

flex-height 也有相同的问题