@ant-design/pro-layout/es/components/SiderMenu/index.js

@ant-design/pro-layout

import "antd/es/drawer/style";
import _Drawer from "antd/es/drawer";
import _extends from "@babel/runtime/helpers/esm/extends";
import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
import React, { useEffect } from 'react';
import classNames from 'classnames';
import Omit from 'omit.js';
import { getFlatMenus } from '@umijs/route-utils';
import SiderMenu from './SiderMenu';
import MenuCounter from './Counter';

var SiderMenuWrapper = function SiderMenuWrapper(props) {
  var isMobile = props.isMobile,
      menuData = props.menuData,
      siderWidth = props.siderWidth,
      collapsed = props.collapsed,
      onCollapse = props.onCollapse,
      style = props.style,
      className = props.className,
      hide = props.hide,
      getContainer = props.getContainer,
      prefixCls = props.prefixCls,
      matchMenuKeys = props.matchMenuKeys;

  var _MenuCounter$useConta = MenuCounter.useContainer(),
      setFlatMenuKeys = _MenuCounter$useConta.setFlatMenuKeys;

  useEffect(function () {
    if (!menuData || menuData.length < 1) {
      return;
    } // 当 menu data 改变的时候重新计算这两个参数


    var newFlatMenus = getFlatMenus(menuData);
    setFlatMenuKeys(Object.keys(newFlatMenus)); // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [matchMenuKeys.join('-')]);
  useEffect(function () {
    if (isMobile === true) {
      onCollapse === null || onCollapse === void 0 ? void 0 : onCollapse(true);
    } // eslint-disable-next-line react-hooks/exhaustive-deps

  }, [isMobile]);
  var omitProps = Omit(props, ['className', 'style']);

  if (hide) {
    return null;
  }

  return isMobile ? /*#__PURE__*/React.createElement(_Drawer, {
    visible: !collapsed,
    placement: "left",
    className: classNames("".concat(prefixCls, "-drawer-sider"), className),
    onClose: function onClose() {
      return onCollapse === null || onCollapse === void 0 ? void 0 : onCollapse(true);
    },
    style: _objectSpread({
      padding: 0,
      height: '100vh'
    }, style),
    getContainer: getContainer,
    width: siderWidth,
    bodyStyle: {
      height: '100vh',
      padding: 0,
      display: 'flex',
      flexDirection: 'row'
    }
  }, /*#__PURE__*/React.createElement(SiderMenu, _extends({}, omitProps, {
    className: classNames("".concat(prefixCls, "-sider"), className),
    collapsed: isMobile ? false : collapsed,
    splitMenus: false
  }))) : /*#__PURE__*/React.createElement(SiderMenu, _extends({
    className: classNames("".concat(prefixCls, "-sider"), className)
  }, omitProps, {
    style: style
  }));
};

export default SiderMenuWrapper;