finish

有些必须两次才有好体验.

src/App.js

@@ -2,13 +2,12 @@ import {
   MenuFoldOutlined, MenuUnfoldOutlined,
   DatabaseFilled
 } from '@ant-design/icons';
-import { Button, Layout, Menu, Tabs } from 'antd';
+import { Button, Layout, Menu } from 'antd';
 import 'antd/dist/antd.css';
-import React, {useRef} from 'react';
+import React from 'react';
 
 import './App.less';
 import ContentTabs from './ContentTabs'
-import TabsRoute from './Router';
 
 const { Header, Content, Footer, Sider } = Layout;
 
@@ -17,8 +16,6 @@ class App extends React.Component {
   constructor(props) {
     super(props)
     this.state = {
-      platform: "openrec",
-      tab: "tabledata",
       collapsed: false
     }
   }
@@ -30,13 +27,12 @@ class App extends React.Component {
   };
 
   changePlatform = (p) => {
-    this.setState({platform: p})
+    // this.setState({c: p})
     this.refs.ctabs.changePlatform(p)
-
   }
 
   render() {
-    const {tab, platform } = this.state;
+
 
     return (
 
@@ -71,7 +67,7 @@ class App extends React.Component {
           </Header>
 
           <Content ref="content" style={{ margin: '0 8px' }}>
-            <ContentTabs ref="ctabs" tab={tab} platform={platform}></ContentTabs>
+            <ContentTabs ref="ctabs" ></ContentTabs>
           </Content>
 
           <Footer style={{ textAlign: 'center' }}>

src/ChartsCount.js

@@ -100,7 +100,6 @@ class ChartsCount extends React.Component {
 
     updateData = (params = {}) => {
 
-        // const {platform, countkey, title} = params
         const platform = params.platform?params.platform:this.state.platform
         const countkey = params.countkey?params.countkey:this.state.countkey
         const title = params.title?params.title:this.state.title
@@ -119,12 +118,15 @@ class ChartsCount extends React.Component {
                         var ins = this.echarts_react.getEchartsInstance();
                         ins.setOption(getOption(this.state));
                     });
-
                 });
             }
         )
     };
 
+    componentDidMount() {
+        this.updateData()
+    }
+
     countMethod(countkey, title) {
         this.updateData({countkey: countkey, title: title});
     }

src/ContentTabs.js

@@ -1,6 +1,6 @@
 
 import React from 'react';
-import { Button, Layout, Menu, Tabs } from 'antd';
+import { Tabs } from 'antd';
 import ChartsCount from './ChartsCount';
 import TableData from './TableData';
 
@@ -11,8 +11,8 @@ class ContentTabs extends React.Component {
   constructor(props) {
     super(props)
     this.state = {
-      platform: this.props.platform,
+      platform: "openrec", // default openrec
-      tab: this.props.tab,
+      tab: "tabledata",// default tabledata
     }
   }
 
@@ -28,8 +28,8 @@ class ContentTabs extends React.Component {
 
   updateDate(params = {}) {
 
-      const platform = params.platform?params.platform:this.state.platform
+    const platform = params.platform ? params.platform : this.state.platform;
-      const tab = params.tab?params.tab:this.state.tab
+    const tab = params.tab ? params.tab : this.state.tab;
     this.setState({ platform: platform, tab: tab });
 
     switch (tab) {
@@ -46,16 +46,15 @@ class ContentTabs extends React.Component {
         break;
       default:
     }
+
   }
 
   changePlatform = (platform) => {
-      this.updateDate({platform: platform})
+    this.updateDate({ platform: platform });
   }
 
   render() {
-      this.count ++
     return (
-
       <Tabs
         onChange={
           this.changeTab

src/Router.js

@@ -1,12 +1,8 @@
 import React from 'react';
 import App from './App';
-import { HashRouter, Route, Switch, BrowserRouter, Redirect } from 'react-router-dom';
+import { Route, Switch, BrowserRouter } from 'react-router-dom';
-import TableData from "./TableData";
+import { Button, Result } from 'antd';
-import ChartsCount from "./ChartsCount";
-import { Link } from 'react-router-dom';
-import { Button, Layout, Menu, Tabs, Result } from 'antd';
 
-const { TabPane } = Tabs;
 
 
 const MainRouter = () => {

src/index.js

@@ -1,10 +1,8 @@
 import React from 'react';
 import ReactDOM from 'react-dom';
 import './index.css';
-import App from './Router';
 import MainRouter from './Router';
 import * as serviceWorker from './serviceWorker';
-import { Route } from 'react-router-dom';
 
 ReactDOM.render(
   <MainRouter />,