remove PureComponent (#3470)

* remove PureComponent

* fix typo

src/components/SiderMenu/SiderMenu.js

@@ -51,7 +51,7 @@ export default class SiderMenu extends PureComponent {
     const defaultProps = collapsed ? {} : { openKeys };
 
     const siderClassName = classNames(styles.sider, {
-      [styles.fixSiderbar]: fixSiderbar,
+      [styles.fixSiderBar]: fixSiderbar,
       [styles.light]: theme === 'light',
     });
     return (

src/components/SiderMenu/index.less

@@ -25,13 +25,13 @@
     font-weight: 600;
   }
 }
-
 .sider {
   min-height: 100vh;
   box-shadow: 2px 0 6px rgba(0, 21, 41, 0.35);
   position: relative;
   z-index: 10;
-  &.fixSiderbar {
+  &.fixSiderBar {
+    box-shadow: 2px 0 8px 0 rgba(29, 35, 41, 0.05);
     position: fixed;
     top: 0;
     left: 0;

src/layouts/BasicLayout.js

@@ -51,7 +51,7 @@ const query = {
   },
 };
 
-class BasicLayout extends React.PureComponent {
+class BasicLayout extends React.Component {
   constructor(props) {
     super(props);
     this.getPageTitle = memoizeOne(this.getPageTitle);

src/layouts/Header.js

@@ -1,4 +1,4 @@
-import React, { PureComponent } from 'react';
+import React, { Component } from 'react';
 import { formatMessage } from 'umi/locale';
 import { Layout, message } from 'antd';
 import Animate from 'rc-animate';
@@ -10,7 +10,7 @@ import styles from './Header.less';
 
 const { Header } = Layout;
 
-class HeaderView extends PureComponent {
+class HeaderView extends Component {
   state = {
     visible: true,
   };

src/layouts/UserLayout.js

@@ -31,42 +31,26 @@ const copyright = (
   </Fragment>
 );
 
-class UserLayout extends React.PureComponent {
-  // @TODO title
-  // getPageTitle() {
-  //   const { routerData, location } = this.props;
-  //   const { pathname } = location;
-  //   let title = 'Ant Design Pro';
-  //   if (routerData[pathname] && routerData[pathname].name) {
-  //     title = `${routerData[pathname].name} - Ant Design Pro`;
-  //   }
-  //   return title;
-  // }
-
-  render() {
-    const { children } = this.props;
-    return (
-      // @TODO <DocumentTitle title={this.getPageTitle()}>
-      <div className={styles.container}>
-        <div className={styles.lang}>
-          <SelectLang />
-        </div>
-        <div className={styles.content}>
-          <div className={styles.top}>
-            <div className={styles.header}>
-              <Link to="/">
-                <img alt="logo" className={styles.logo} src={logo} />
-                <span className={styles.title}>Ant Design</span>
-              </Link>
-            </div>
-            <div className={styles.desc}>Ant Design 是西湖区最具影响力的 Web 设计规范</div>
-          </div>
-          {children}
+const UserLayout = ({ children }) => (
+  // @TODO <DocumentTitle title={this.getPageTitle()}>
+  <div className={styles.container}>
+    <div className={styles.lang}>
+      <SelectLang />
+    </div>
+    <div className={styles.content}>
+      <div className={styles.top}>
+        <div className={styles.header}>
+          <Link to="/">
+            <img alt="logo" className={styles.logo} src={logo} />
+            <span className={styles.title}>Ant Design</span>
+          </Link>
         </div>
-        <GlobalFooter links={links} copyright={copyright} />
+        <div className={styles.desc}>Ant Design 是西湖区最具影响力的 Web 设计规范</div>
       </div>
-    );
-  }
-}
+      {children}
+    </div>
+    <GlobalFooter links={links} copyright={copyright} />
+  </div>
+);
 
 export default UserLayout;