如何等待所有axios完成

pwuypxnk 于 2022-11-23 发布在 iOS

关注(0)|答案(1)|浏览(293)

我想等到useEffect中的所有axio都完成。
使用效果：

useEffect(() => {
 
  async function getHomePageContent() {
      
    await HomePageServices.getSliderContent().then((response) => {
      setSliderProduct(response.data);
    });

    await HomePageServices.getRecommendedProducts().then((response) => {
      setRecommendedProducts(response.data);
    });

    await HomePageServices.getMostOrderProducts().then((response) => {
      setMostOrderProducts(response.data);
    });

    await HomePageServices.getMostRatedProducts().then((response) => {
      setMostRatedProducts(response.data);
    });
  }
  
  getHomePageContent().catch((error) => {
    console.log(error)
 });

     
  }, []);

班级：

class HomePageServices{

 async getSliderContent(){
    return await axios.get(baseURL+"/slider")
}    

 async getMostRatedProducts(){
    return await axios.get(baseURL+"/mostRatedProducts")
}    

async getMostOrderProducts(){
    return await axios.get(baseURL+"/mostOrderProduct")
}

 async getRecommendedProducts(){
    return await axios.get(baseURL+"/recommendedProduct")
}
}

有人能给我解释一下如何等待所有 axios 结束，如果一个 axios 失败了，如何找出是哪一个 axios ？

axios

来源：https://stackoverflow.com/questions/74437116/react-how-to-wait-for-all-axios-to-finish

1条答案

按热度按时间

unftdfkk1#

尝试使用Promise.allSettled()，它接受一个可迭代（例如数组）的承诺，并解析为每个承诺的结果数组。
结果表示为具有status键的对象，该键可以是rejected或fulfilled。对象的第二个键是包含解析值的value，或者是reason（如果承诺被拒绝）。
这样，useEffect中的代码可能如下所示：

useEffect(() => {

  const getHomePageContent = async () => ({
    const promises = [
       HomePageServices.getSliderContent(),
       HomePageServices.getRecommendedProducts(),
       HomePageServices.getMostOrderProducts(),
       HomePageServices.getMostRatedProducts()
    ];

    const data = await Promise.allSettled(promises);
    const [slider, recommended, mostordered, mostrated] = data;

    // result for each of promise
    console.log(slider); // { status: 'fulfilled', value: 123 }
    console.log(recommended) // { status: 'rejected', reason: 'blah'}
  });

  getHomePageContent().catch((er) => console.log(er))
}, [])

赞(0）回复(0）举报 2022-11-23

我来回答

如何等待所有axios完成

1条答案

相关问题

热门标签

最新问答