改一下跳转

src/App.js

@@ -18,11 +18,24 @@ class App extends Component {
         }
     }
 
-    changeTabBar = (tab, hidden) => {
-        this.setState({
-            selectedTab: tab,
-            tabHidden: hidden !== undefined ? hidden : false
-        })
+    componentWillMount() {
+        let {location} = this.props,
+            pathname = location.pathname,
+            state = location.state
+
+        // 有 state 的话，就隐藏 tabbar
+        if (location && state) {
+            this.setState({
+                tabHidden: true
+            })
+        }
+
+        // 根据 pathname 显示 icon 选中
+        if (location && pathname) {
+            this.setState({
+                selectedTab: pathname.substr(1) === ''? 'home' : pathname.substr(1)
+            })
+        }
     }
 
     chooseClassNames = (tabbar) => (
@@ -35,79 +48,78 @@ class App extends Component {
     render() {
         let {selectedTab, tabHidden, page} = this.state
         return (
-
-                <div>
-                    <div className={classnames('tabbar', {'tarbar-hidden': tabHidden})}>
-                        <Row>
-                            <NavLink exact to="/">
-                                <Col className={this.chooseClassNames('home')} span={8} onClick={() => {
-                                    this.props.history.push({
-                                        pathname: '/home'
-                                    })
-                                    this.setState({
-                                        selectedTab: 'home'
-                                    })
-                                }}>
-                                    {
-                                        selectedTab === 'home' ?
-                                            <HomeSelectedIcon/>
-                                            :
-                                            <HomeUnselectedIcon/>
-                                    }
-                                    <div>
-                                        主页
-                                    </div>
-                                </Col>
-                            </NavLink>
-                            <NavLink to="/cart">
-                                <Col className={this.chooseClassNames('cart')} span={8} onClick={() => {
-                                    this.props.history.push({
-                                        pathname: '/cart'
-                                    })
-                                    this.setState({
-                                        selectedTab: 'cart'
-                                    })
-                                }}>
-                                    {
-                                        selectedTab === 'cart' ?
-                                            <CartSelectedIcon/>
-                                            :
-                                            <CartUnselectedIcon/>
-                                    }
-                                    <div>
-                                        购物篮
-                                    </div>
-                                </Col>
-                            </NavLink>
-                            <NavLink to="/my">
-                                <Col className={this.chooseClassNames('my')} span={8} onClick={() => {
-                                    this.props.history.push({
-                                        pathname: '/my'
-                                    })
-                                    this.setState({
-                                        selectedTab: 'my'
-                                    })
-                                }}>
-                                    {
-                                        selectedTab === 'my' ?
-                                            <MySelectedIcon/>
-                                            :
-                                            <MyUnselectedIcon/>
-                                    }
-                                    <div>
-                                        我
-                                    </div>
-                                </Col>
-                            </NavLink>
-                        </Row>
-                    </div>
-                    <Switch>
-                        <Route exact path="/" component={Home}/>
-                        <Route path="/home" component={Home}/>
-                        <Route path="/cart" component={Cart}/>
-                        <Route path="/my" component={My}/>
-                    </Switch>
+            <div>
+                <div className={classnames('tabbar', {'tarbar-hidden': tabHidden})}>
+                    <Row>
+                        <NavLink exact to="/">
+                            <Col className={this.chooseClassNames('home')} span={8} onClick={() => {
+                                this.props.history.push({
+                                    pathname: '/home'
+                                })
+                                this.setState({
+                                    selectedTab: 'home'
+                                })
+                            }}>
+                                {
+                                    selectedTab === 'home' ?
+                                        <HomeSelectedIcon/>
+                                        :
+                                        <HomeUnselectedIcon/>
+                                }
+                                <div>
+                                    主页
+                                </div>
+                            </Col>
+                        </NavLink>
+                        <NavLink to="/cart">
+                            <Col className={this.chooseClassNames('cart')} span={8} onClick={() => {
+                                this.props.history.push({
+                                    pathname: '/cart'
+                                })
+                                this.setState({
+                                    selectedTab: 'cart'
+                                })
+                            }}>
+                                {
+                                    selectedTab === 'cart' ?
+                                        <CartSelectedIcon/>
+                                        :
+                                        <CartUnselectedIcon/>
+                                }
+                                <div>
+                                    购物篮
+                                </div>
+                            </Col>
+                        </NavLink>
+                        <NavLink to="/my">
+                            <Col className={this.chooseClassNames('my')} span={8} onClick={() => {
+                                this.props.history.push({
+                                    pathname: '/my'
+                                })
+                                this.setState({
+                                    selectedTab: 'my'
+                                })
+                            }}>
+                                {
+                                    selectedTab === 'my' ?
+                                        <MySelectedIcon/>
+                                        :
+                                        <MyUnselectedIcon/>
+                                }
+                                <div>
+                                    我
+                                </div>
+                            </Col>
+                        </NavLink>
+                    </Row>
                 </div>
+                <Switch>
+                    <Route exact path="/" component={Home}/>
+                    <Route path="/home" component={Home}/>
+                    <Route path="/cart" component={Cart}/>
+                    <Route path="/my" component={My}/>
+                </Switch>
+            </div>
 
         )
     }