react-router路由跳转的问题

Question

问题描述
这么一个场景，2个页面一个是form表单，一个是table列表
现在在form表单中使用reduerdispatch新增方法之后，需要跳转到table页面。
问题出现的环境背景及自己尝试过哪些方法
一开始的做法是在dispatch后面，调用router的push方法，跳转到table页面，但是发现table有一个获取数据的api会在form页面的save方法之前调用，导致获取的数据是form表单提交之前的数据虽然可以使用延迟避免这样的问题。但是想知道是否有别的方法。
另外想到的就是在reducer中调用router的push方法来完成路由的跳转
相关代码
functionformSubmit(e){
e.preventDefault()
props.form.validateFields((error,value)=>{
if(!error){
props.saveExpress(value)
props.history.push('/express/list')
}
})
}
这是调用dispatch之后调用push方法的代码
你期待的结果是什么？实际看到的错误信息又是什么？
想知道大家正常的逻辑是在哪里调用的
查看了antd-pro代码，使用回调函数解决1、改造saveExpress
props.saveExpress(value,()=>props.history.push('/express/list'))
2、修改对应的action
exportconstsaveExpress=(express,callback)=>({
type:Actions.SAVE_EXPRESS,
express,
callback
})
3、修改对应的epic（由于使用的redux-observable所以会有这个方法）
constsaveExpress=action$=>
action$.pipe(
ofType(Actions['SAVE_EXPRESS']),
switchMap(params=>
postExpress({...params.express}).then(()=>{
params.callback()
returnsaveExpressSuccess()
})
)
)
由此问题可以解决

Answer 1

改造下saveExpress方法，让此方法提供一个成功的回调，然后将props.history.push('/express/list')写在回调函数中。

Answer 2

saveExpress异步方法returnPromise，然后使用async/awaitprops.form.validateFields(async(error,value)=>{if(!error){awaitprops.saveExpress(value)props.history.push('/express/list')}})