React+Ts项目，异步接口如何同步执行

Question

React+TS函数组件，要实现首屏加载调用getVersionsData()接口获取到一个数组对象，该数组中第一个对象（不固定）作为getHeroCovsData()接口的参数传给后端从而得到想要的数据（目前我这种写法虽然可以实现，但是是异步执行这里接口（getHeroCovsData）会被调用多次并且前几次拿到的数据是undefined导致接口（getHeroCovsData）调用失败，想要实现getVersionsData调用以后在调用getHeroCovsData接口，也就是实现同步），要怎么实现？

Answer 1

首先你写的位置不正确
你用的hooks

hooks 中只要有内容变化 state or props 就会不断执行 。所以建议你这样写

useEffect(() => {
dispatch(vsrsionActions.getVersionData());
}, [])

// 第二个effect加入你需要的数据的依赖， 这样就能保证执行
useEffect(() => {
  if (vsrsionActions.getVersionData()返回的数据) {
    getHeroCovsData();
  }
}, [这里放入vsrsionActions.getVersionData()返回的数据])

还可以改造dispatch 增加callback,当执行完第一个以后 通过callback 执行 后续的操作，怎么增加callback,自己百度，都有的。

提个建议，提问题不要贴图片，复制代码，方便回答的人粘贴

Answer 2

方法用 async
执行的地方加上 await
不可以吗

Answer 3

你是用了redux-thunk吗？dispatch一个thunk action会返回一个promise，await它就行了