mirror of
https://github.com/ant-design/ant-design.git
synced 2025-08-06 16:06:28 +08:00
Fix inlineCollpased Menu remains inline mode instead of vertical
close ant-design/ant-design-pro#2783 close ant-design/ant-design-pro#2782 close ant-design/ant-design-pro#2786
This commit is contained in:
parent
5fa67a90bc
commit
85a758c7ec
@ -131,14 +131,21 @@ export default class Menu extends React.Component<MenuProps, MenuState> {
|
||||
this.inlineOpenKeys = [];
|
||||
}
|
||||
}
|
||||
restoreModeVerticalFromInline() {
|
||||
if (this.switchingModeFromInline) {
|
||||
this.switchingModeFromInline = false;
|
||||
this.setState({});
|
||||
}
|
||||
}
|
||||
handleTransitionEnd = (e: TransitionEvent) => {
|
||||
// when inlineCollapsed menu width animation finished
|
||||
// https://github.com/ant-design/ant-design/issues/12864
|
||||
if (e.propertyName === 'width' &&
|
||||
e.target === e.currentTarget &&
|
||||
this.switchingModeFromInline) {
|
||||
this.switchingModeFromInline = false;
|
||||
this.setState({});
|
||||
const widthCollapsed = e.propertyName === 'width' && e.target === e.currentTarget;
|
||||
// Fix for <Menu style={{ width: '100%' }} />, the width transition won't trigger when menu is collapsed
|
||||
// https://github.com/ant-design/ant-design-pro/issues/2783
|
||||
const iconScaled = e.propertyName === 'font-size' && (e.target as HTMLElement).className.indexOf('anticon') >= 0;
|
||||
if (widthCollapsed || iconScaled) {
|
||||
this.restoreModeVerticalFromInline();
|
||||
}
|
||||
}
|
||||
handleClick = (e: ClickParam) => {
|
||||
|
Loading…
Reference in New Issue
Block a user