fix(docs): 优化模块网站体验

Yoshino-UI · Jul 4, 2018 · b0f0e90 · b0f0e90
1 parent 682b0b7
commit b0f0e90
Show file tree

Hide file tree

Showing 2 changed files with 32 additions and 26 deletions.
diff --git a/components/Backtop/assist.tsx b/components/Backtop/assist.tsx
@@ -1,4 +1,4 @@
-export const backTop = (durations: number, callback: () => void | undefined) => {
+export const backTop = (durations: number, callback?: () => void | undefined) => {
   let dom: HTMLElement;
   if (document.documentElement.scrollTop) {
     dom = document.documentElement;

diff --git a/docs/pages/index.tsx b/docs/pages/index.tsx
@@ -3,27 +3,27 @@ import { Component } from 'react';
 import { Switch, Route, Redirect } from 'react-router-dom';
 import { Link } from 'react-router-dom';
 import {Menu, BackTop} from '../../components/';
+import { backTop } from '../../components/BackTop/assist';
 import './index.less';
 import menuObj from './menu';
 import { MenuItem } from '../../components/Menu/MenuItem';
 import { RouteComponentProps } from 'react-router';
 import Routes from './routes';
 
-
-export interface IProps  extends RouteComponentProps<{name: string}>{
-
+export interface IProps  extends RouteComponentProps<{name: string}> {
 }
 
 const SubMenu = Menu.SubMenu;
 const MenuItemGroup = Menu.ItemGroup;
 
 export default class Components extends Component<IProps> {
   pushHistory = (url: string) => {
-    this.props.history.push('/components/' + url)
+    this.props.history.push('/components/' + url);
+    backTop(300);
   }
 
   render() {
-    const preCls = 'wrapper'
+    const preCls = 'wrapper';
     const current = this.props.match.params.name;
     return (
       <div>
@@ -39,24 +39,30 @@ export default class Components extends Component<IProps> {
             defaultActiveKey={current}
             defaultOpenKeys={['components']}
           >
-            <Menu.Item keyId="yoshino" onClick={this.pushHistory.bind(this, 'yoshino')}>Yoshino</Menu.Item>
-            <Menu.Item keyId="start" onClick={this.pushHistory.bind(this, 'start')}>快速开始</Menu.Item>
-            <Menu.Item keyId="logs" onClick={this.pushHistory.bind(this, 'logs')}>更新日志</Menu.Item>
-            <Menu.Item keyId="faq" onClick={this.pushHistory.bind(this, 'faq')}>FAQ</Menu.Item>
-            <SubMenu title="组件" keyId="components">
+            <Menu.Item keyId='yoshino' onClick={this.pushHistory.bind(this, 'yoshino')}>Yoshino</Menu.Item>
+            <Menu.Item keyId='start' onClick={this.pushHistory.bind(this, 'start')}>快速开始</Menu.Item>
+            <Menu.Item keyId='logs' onClick={this.pushHistory.bind(this, 'logs')}>更新日志</Menu.Item>
+            <Menu.Item keyId='faq' onClick={this.pushHistory.bind(this, 'faq')}>FAQ</Menu.Item>
+            <SubMenu title='组件' keyId='components'>
               {
-                menuObj.map((item) => {
+                menuObj.map((menu) => {
                   return (
-                    <MenuItemGroup title={item.name} keyId={item.keyId} key={item.keyId}>
+                    <MenuItemGroup title={menu.name} keyId={menu.keyId} key={menu.keyId}>
                       {
-                        item.children.map((item) => {
+                        menu.children.map((item) => {
                           return (
-                            <MenuItem key={item.keyId} keyId={item.keyId} onClick={this.pushHistory.bind(this, item.keyId)}>{item.name}</MenuItem>
-                          )
+                            <MenuItem
+                              key={item.keyId}
+                              keyId={item.keyId}
+                              onClick={this.pushHistory.bind(this, item.keyId)}
+                            >
+                              {item.name}
+                            </MenuItem>
+                          );
                         })
                       }
                     </MenuItemGroup>
-                  )
+                  );
                 })
               }
             </SubMenu>
@@ -68,19 +74,19 @@ export default class Components extends Component<IProps> {
                 Routes.map((item, key) => {
                   return (
                     <Route {...item} path={`${item.path}`} key={key} exact/>
-                  )
+                  );
                 })
               }
-              <Route render={()=> {
-                return <Redirect to="/components/"/>
-              }}/>
+              <Route
+                render={() => {
+                return <Redirect to='/components/'/>;
+               }}
+              />
             </Switch>
           </div>
         </div>
-        <div className={`${preCls}-footer`}>
-
-        </div>
+        <div className={`${preCls}-footer`}/>
       </div>
-    )
+    );
   }
-};
+}