antd pro v4菜单onCollapse无法收起

最近升级到antd-prov4，遇到个奇葩问题，在此记录一下自己的解决方案，有更好方案的朋友们留言下：

1.定义两个变量：

var ltt;
var isClp=false;

2.事件处理拦截

const handleMenuCollapse = (payload) => {
    if(!ltt){
        ltt = Date.now();
    }
    else{
        let ntt = Date.now();
         if(!isClp && ltt-ntt<100){
             isClp = true;
            return;
        }
        isClp = props.collapsed;
    }
    if (dispatch) {
        dispatch({
            type: 'global/changeLayoutCollapsed',
            payload,
        });
    }
};

暂时这样解决，完整代码如下：

/**
 * 布局
 */
import ProLayout from '@ant-design/pro-layout';
import React, { useEffect, useRef } from 'react';
import { Link, connect, history } from 'umi';
import { Button } from 'antd';
import RightContent from '@/components/GlobalHeader/RightContent';
import GlobalFooter from '@/components/GlobalFooter';
import logo from '../assets/logo.png';
import {getKey} from '@/utils/KevyUtil';
import {IconMap} from '@/utils/IconMap';
import { HomeOutlined } from '@ant-design/icons';
var ltt;
var isClp=false;
/**
 * 初始化菜单
 */
const menuDataRender = (menuList) =>
    menuList.map((item) => {
        let localItem = {
            ...item,
            children: item.children ? menuDataRender(item.children) : undefined,
        };
        if (localItem.icon) {
            localItem = {
                ...localItem,
                icon: IconMap[item.icon]
            }
        }
        else {
            delete localItem["icon"];
        }
        return localItem;
    });
const BasicLayout = (props) => {
    const {
        dispatch,
        children,
        settings,
        } = props;
    const menuDataRef = useRef([]);
    /**
     * 初始化拦截
     */
    useEffect(() => {
        const token = getKey("token");
        if (dispatch) {
            if (!token) {
                dispatch({
                    type: 'login/logout'
                }).then(() => history.push("/login"));
            }
        }
    }, []);
    /**
     * 菜单折叠监听
     */
    const handleMenuCollapse = (payload) => {
        if(!ltt){
            ltt = Date.now();
        }
        else{
            let ntt = Date.now();
             if(!isClp && ltt-ntt<100){
                 isClp = true;
                return;
            }
            isClp = props.collapsed;
        }

        if (dispatch) {
            dispatch({
                type: 'global/changeLayoutCollapsed',
                payload,
            });
        }
    };
    //prolayout API: https://github.com/ant-design/ant-design-pro-layout/blob/master/README.zh-CN.md
    return (
        <ProLayout
            logo={logo}
            onCollapse={handleMenuCollapse}
            menu= {{ locale: false,defaultOpenAll:false }}
            onMenuHeaderClick={() => history.push(getKey("homeUrl"))}
            menuItemRender={(menuItemProps, defaultDom) => {
                if (menuItemProps.isUrl || !menuItemProps.path) {
                  return defaultDom;
                }

                return <Link to={menuItemProps.path}>{defaultDom}</Link>;
              }}
            breadcrumbRender={(routers = []) => [
                {
                  path: '/',
                  breadcrumbName: '主页'
                },
                ...routers
              ]}
            itemRender={(route, params, routes, paths) => {
                return <span>{route.breadcrumbName}</span>;
              }}
            footerRender={() => <GlobalFooter />}
            menuDataRender={() => menuDataRender(getKey("menuList") || [])}
            rightContentRender={() => <RightContent />}
            postMenuData={(menuData) => {
                menuDataRef.current = menuData || [];
                return menuData || [];
              }}
            {...props}
            {...settings}
        >
            {children}
        </ProLayout>
    );
};
export default connect(({ global, settings }) => ({
    collapsed: global.collapsed,
    settings,
}))(BasicLayout);