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.

Sign up for GitHub

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

Jump to bottom

horizontal的menu，外层如果有100vh的元素，则折叠计算边界处会一直闪 #26653

Closed
1 task
CaanDoll opened this issue Sep 9, 2020 · 12 comments
Closed
1 task

horizontal的menu，外层如果有100vh的元素，则折叠计算边界处会一直闪 #26653

CaanDoll opened this issue Sep 9, 2020 · 12 comments
Labels
🐛 Bug Ant Design Team had proved that this is a bug. help wanted The suggestion or request has been accepted, we need you to help us by sending a pull request. Inactive

Comments

@CaanDoll
Copy link

CaanDoll commented Sep 9, 2020

  • I have searched the issues of this repository and believe that this is not a duplicate.

Reproduction link

Edit on CodeSandbox

Steps to reproduce

拖动预览边框（或新窗口打开改变浏览器窗口大小）至折叠边界处

What is expected?

显示正常

What is actually happening?

一直在闪

Environment Info
antd 4.6.3
React 16.13.1
System windows10
Browser chrome84

是否折叠判断进入死循环
@Homingciu
Copy link

+1， 设置宽度和各种影响宽度的样式都会有这种问题

@afc163 afc163 added 🐛 Bug Ant Design Team had proved that this is a bug. help wanted The suggestion or request has been accepted, we need you to help us by sending a pull request. labels Sep 9, 2020
@ant-design-bot
Copy link
Contributor

Hello @CaanDoll. We totally like your proposal/feedback, welcome to send us a Pull Request for it. Please send your Pull Request to proper branch (feature branch for the new feature, master for bugfix and other changes), fill the Pull Request Template here, provide changelog/TypeScript/documentation/test cases if needed and make sure CI passed, we will review it soon. Appreciate it advance and we are looking forward to your contribution!

你好 @CaanDoll, 我们完全同意你的提议/反馈，欢迎直接在此仓库 创建一个 Pull Request 来解决这个问题。请将 Pull Request 发到正确的分支（新特性发到 feature 分支，其他发到 master 分支），务必填写 Pull Request 内的预设模板，提供改动所需相应的 changelog、TypeScript 定义、测试用例、文档等，并确保 CI 通过，我们会尽快进行 Review，提前感谢和期待您的贡献！

giphy

@Homingciu
Copy link

找到原因了，这里的style应该是{...propStyle, display: 'none'} 才对，不然设置的样式会被覆盖掉。导致原本设置了width，而这里把width丢掉，所以计算li的width时，li只根据了‘inline-block’来计算宽度，而没有width属性。所以会出错。

现在的兼容解决方式是，在css文件里面给.ant-menu-item设置样式（而不是写行间样式），这样就不会被覆盖掉。

image

@Homingciu
Copy link

再提一句，下面那个className没有继承原来的className，也是造成bug的原因

@xrkffgg
Copy link
Member

xrkffgg commented Sep 10, 2020

PR welcome

@Homingciu
Copy link

PR welcome

这是rc-menu组件的bug，我在这提有用吗

@yoyo837
Copy link
Contributor

yoyo837 commented Sep 10, 2020

提到那边...

@afc163 afc163 mentioned this issue Sep 26, 2020
Closed
1 task
@afc163
Copy link
Member

afc163 commented Sep 26, 2020

same problem: #26908

@kerm1it
Copy link
Member

kerm1it commented Oct 30, 2020

@afc163 我试了试好像没有问题了，你看看。

@afc163
Copy link
Member

afc163 commented Oct 30, 2020

我测试 codesandbox 里也确实没问题了，@CaanDoll 可以确认一下，有问题我再 reopen。

@afc163 afc163 closed this as completed Oct 30, 2020
@m-weeks
Copy link

m-weeks commented Nov 9, 2020

@afc163 it is still an issue on this codesandbox from #26908

Edit on CodeSandbox

@afc163 afc163 reopened this Nov 10, 2020
@afc163
Copy link
Member

afc163 commented Jun 1, 2021

Fixed in #30382

@afc163 afc163 closed this as completed Jun 1, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
🐛 Bug Ant Design Team had proved that this is a bug. help wanted The suggestion or request has been accepted, we need you to help us by sending a pull request. Inactive
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
8 participants
@afc163 @yoyo837 @CaanDoll @Homingciu @ant-design-bot @xrkffgg @kerm1it @m-weeks