dispatch window resize event when menu collapse

src/components/FooterToolbar/index.js

@@ -1,39 +1,13 @@
 import React, { Component } from 'react';
-import PropTypes from 'prop-types';
 import classNames from 'classnames';
 import styles from './index.less';
 
 export default class FooterToolbar extends Component {
-  static contextTypes = {
-    layoutCollapsed: PropTypes.bool,
-  };
-  state = {
-    width: '',
-  };
-  componentDidMount() {
-    this.syncWidth();
-  }
-  componentWillReceiveProps() {
-    this.syncWidth();
-  }
-  syncWidth() {
-    const sider = document.querySelectorAll('.ant-layout-sider')[0];
-    if (sider) {
-      this.setState({
-        width: `calc(100% - ${sider.style.width})`,
-      });
-    }
-  }
   render() {
-    const { children, style, className, extra, ...restProps } = this.props;
+    const { children, className, extra, ...restProps } = this.props;
     return (
       <div
         className={classNames(className, styles.toolbar)}
-        ref={this.getRefNode}
-        style={{
-          width: this.state.width,
-          ...style,
-        }}
         {...restProps}
       >
         <div className={styles.left}>{extra}</div>

src/layouts/BasicLayout.js

@@ -170,6 +170,9 @@ class BasicLayout extends React.PureComponent {
       type: 'global/changeLayoutCollapsed',
       payload: !collapsed,
     });
+    const event = document.createEvent('HTMLEvents');
+    event.initEvent('resize', true, false);
+    window.dispatchEvent(event);
   }
   handleNoticeClear = (type) => {
     message.success(`清空了${type}`);