Axios异步请求结束后forEach未执行

我在将Vue和Pinia结合使用时发现在Axios请求结束后forEach并没有执行，后来发现是由于Axios请求还未结束forEach却先执行了，此时Axios请求还没有获取到任何数据，那么forEach将对一个空数组进行操作，但是forEach对于空数组是不会执行回调函数的，所以forEach完全没有执行。

解决方法是使用Promise.all().then()

修改前的代码

<script setup lang="ts">
import ...

// getWebInfoList方法继承自Store,是一个发起异步请求获取数据的方法
// 这里不用理解这个方法具体是干什么的，当作任意异步请求就行
webInfo.getWebInfoList();
webInfo.webInfoList.forEach((item: any) => {
  console.log("forEach执行了")
})
<script>

修改后的代码

<script setup lang="ts">
import ...

// getWebInfoList方法继承自Store,是一个发起异步请求获取数据的方法
// 这里不用理解这个方法具体是干什么的，当作任意异步请求就行
webInfo.getWebInfoList().then(() => {
  Promise.all(webInfo.webInfoList).then(() => {
    webInfo.webInfoList.forEach((item: any) => {
      console.log("forEach执行了")
    })
  })
})
<script>