Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Menu] 纵向 menu 组件的 collapsed=false && expandType="popup" 时,SubMenu 被截断。 #2057

Closed
moecasts opened this issue Mar 15, 2023 · 4 comments

Comments

@moecasts
Copy link
Collaborator

tdesign-react 版本

1.0.3

重现链接

https://stackblitz.com/edit/react-drjmx4?file=src%2Fdemo.jsx

重现步骤

image

期望结果

No response

实际结果

No response

框架版本

No response

浏览器版本

No response

系统版本

No response

Node版本

No response

补充说明

No response

@github-actions
Copy link
Contributor

👋 @moecasts,感谢给 TDesign 提出了 issue。
请根据 issue 模版确保背景信息的完善,我们将调查并尽快回复你。

@github-actions
Copy link
Contributor

♥️ 有劳 @MingjieZhang @andyjxli 尽快确认问题。
确认有效后将下一步计划和可能需要的时间回复给 @moecasts

PBK-B added a commit to PBK-B/tdesign-react that referenced this issue Apr 3, 2023
PBK-B added a commit to PBK-B/tdesign-react that referenced this issue Apr 3, 2023
@PBK-B
Copy link
Contributor

PBK-B commented Apr 3, 2023

@MingjieZhang @andyjxli
具体原因:
https://github.com/Tencent/tdesign-react/blob/develop/src/menu/Menu.tsx#L44 处判断设置 collapsed 时会添加 t-menu--scroll 样式,导致子组件无法溢出

解决方案1:
通过判断 expandType 是否为 popup 做为条件来判断是否添加 t-menu--scroll 样式。(Vue 那边就是这样处理的 相关代码 不过我觉得治标不治本,且会导致 menu 内容高度超过之后不可滑动)
方案1修复代码: PBK-B@6ce8d8e

解决方案2:
将 SubMenu 中的 popup 部分节点直接挂载到 body 上,或者在 SubMenu 中直接使用 Popup 组件(两种做法实际上是一样的解决思路),但是这样的话应该是需要在 tdesign-common 中修改 t-menu__popup 相关样式了,我下面的代码在 theme="dark" 情况下还是白色样式就是这样
方案2修复代码: PBK-B@0614e05

@HaixingOoO
Copy link
Collaborator

@moecasts pushlish v1.1.10,close.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants