项目中使用到antd组件中的Tabs,每个Tab要点击实现不同的路由跳转和tab切换。出现每次切换都要点两次才能过去,然后测试发现每次activeTab都会滞后一个值显示。
解决方案代码大致如下:
onTabChanged = (key) => {this.setState({tabKey:key});this.props.history.replace({pathname:/my/url/ + key, state:{tabKey: key}});}render() {return (<Layout><Tabs activeKey={(this.props.location.state && this.props.location.state.tabKey) ? this.props.location.state.tabKey : firstTab} onChange={this.onTabChanged}><TabPane tab="First Tab" key="firstTab"><Route exact path="/my/url/firstTab" component={FirstComponent}/></TabPane><TabPane tab="Second Tab" key="secondTab"><Route exact path="/my/url/secondTab" component={SecondComponent}/&g