diff --git a/src/components/SiderMenu/SiderMenu.js b/src/components/SiderMenu/SiderMenu.js index b7782f7c1fe924df02d287112dd4c0fc6f0fc351..aafd8c06fe0f53e92126244d0d51b8214735ae81 100644 --- a/src/components/SiderMenu/SiderMenu.js +++ b/src/components/SiderMenu/SiderMenu.js @@ -9,6 +9,8 @@ import { getDefaultCollapsedSubMenus } from './SiderMenuUtils'; const BaseMenu = React.lazy(() => import('./BaseMenu')); const { Sider } = Layout; +let firstMount = true; + export default class SiderMenu extends PureComponent { constructor(props) { super(props); @@ -17,6 +19,10 @@ export default class SiderMenu extends PureComponent { }; } + componentDidMount() { + firstMount = false; + } + static getDerivedStateFromProps(props, state) { const { pathname, flatMenuKeysLen } = state; if ( @@ -50,7 +56,7 @@ export default class SiderMenu extends PureComponent { }; render() { - const { logo, collapsed, onCollapse, fixSiderbar, theme } = this.props; + const { logo, collapsed, onCollapse, fixSiderbar, theme, isMobile } = this.props; const { openKeys } = this.state; const defaultProps = collapsed ? {} : { openKeys }; @@ -64,7 +70,11 @@ export default class SiderMenu extends PureComponent { collapsible collapsed={collapsed} breakpoint="lg" - onCollapse={onCollapse} + onCollapse={(collapse) => { + if (firstMount || !isMobile) { + onCollapse(collapse); + } + }} width={256} theme={theme} className={siderClassName} diff --git a/src/layouts/BasicLayout.js b/src/layouts/BasicLayout.js index 4e9c2e5294e288343bfd7d0dd295c186d9d2ceba..cfcf704d2661e1cb1f816ec730ef4e21cd6fca0b 100644 --- a/src/layouts/BasicLayout.js +++ b/src/layouts/BasicLayout.js @@ -75,15 +75,6 @@ class BasicLayout extends React.Component { }); } - componentDidUpdate(preProps) { - // After changing to phone mode, - // if collapsed is true, you need to click twice to display - const { collapsed, isMobile } = this.props; - if (isMobile && !preProps.isMobile && !collapsed) { - this.handleMenuCollapse(false); - } - } - getContext() { const { location, breadcrumbNameMap } = this.props; return {