forEach no se ejecuta después de que finaliza la solicitud asincrónica de Axios

Cuando usé Vue y Pinia juntos, descubrí que forEach no se ejecutó después de que finalizó la solicitud de Axios. Más tarde descubrí que era porque la solicitud de Axios aún no había finalizado pero forEach se ejecutó primero. En este momento, la solicitud de Axios había No se obtuvo ningún dato, por lo que forEach operaría con una matriz vacía, pero forEach no ejecutará la función de devolución de llamada para una matriz vacía, por lo que forEach no se ejecutará en absoluto.

La solución es usar Promise.all().then()

Código antes de la modificación

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

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

Código modificado

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

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