亚洲国产日韩欧美一区二区三区,精品亚洲国产成人av在线,国产99视频精品免视看7,99国产精品久久久久久久成人热,欧美日韩亚洲国产综合乱

Nuxt 3 中的巢狀 useFetch
P粉590929392
P粉590929392 2024-03-25 18:44:17
0
2
818

如何在 Nuxt 3 中完成巢狀抓??? 我有兩個(gè) API。第二個(gè) API 必須根據(jù)第一個(gè) API 傳回的值來(lái)觸發(fā)。

我嘗試了下面的程式碼片段,但它不起作用,因?yàn)?page.Id 在呼叫時(shí)是 null 。我知道第一個(gè) API 傳回有效資料。所以我猜想在第一個(gè) API 回傳結(jié)果之前會(huì)觸發(fā)第二個(gè) API。

<script setup>
  const route = useRoute()
  const { data: page } = await useFetch(`/api/page/${route.params.slug}`)
  const { data: paragraphs } = await useFetch(`/api/page/${page.Id}/paragraphs`)
</script>

顯然這是一個(gè)簡(jiǎn)單的嘗試,因?yàn)闆](méi)有檢查第一個(gè) API 是否實(shí)際傳回任何資料。它甚至沒(méi)有等待響應(yīng)。

在 Nuxt2 中,我會(huì)將第二個(gè) API 呼叫放在 .then() 內(nèi),但對(duì)於這個(gè)新的 Composition API 設(shè)置,我有點(diǎn)無(wú)能為力。

P粉590929392
P粉590929392

全部回覆(2)
P粉505917590

一種解決方案是避免使用await。另外,使用引用來(lái)保存值。這將使您的 UI 和其他邏輯具有反應(yīng)性。

sssccc
P粉561323975

您可以觀看頁(yè)面,然後在頁(yè)面可用時(shí)執(zhí)行API調(diào)用,您應(yīng)該將paragraphs作為ref,然後分配解構(gòu)的資料:

sssccc

最新下載
更多>
網(wǎng)站特效
網(wǎng)站源碼
網(wǎng)站素材
前端模板