みなさんこんにちは!
イザナギです。
いや〜暑いですね...
クーラーが欠かせないです。
熱中症に気をつけないと!
さて話は変わりまして、今回はNuxt3で開発中に起こった事象について書いていきたいと思います。(2022/7/24 時点での情報です)
開発中のバージョン等の情報は以下のとおりです。
- Operating System: Linux
- Node Version: v18.6.0
- Nuxt Version: 3.0.0-rc.8
- Package Manager: yarn@1.22.19
useFetchでAPIのデータを取得できない?
現在Nuxt3でブログを再構築中で、「useFetch」を使ってmicrocmsのデータを取得しようとしたら、
なぜか取得できない?
原因を調べてみたら、下記githubのisuueに載ってました。
https://github.com/nuxt/framework/issues/5993
どうやら、同一ページ内で「useFetch」を複数回使う?と、2回目以降に実施されるデータは取得できないみたいですね。
解決策としては、「useFetch」使っている所全て?に「initialCache」「key」パラメータを使い、
以下例のように実装してあげるといいみたいです。
import { hash } from "ohash"
const { data, pending, refresh, error } = await useFetch(() =>
url,
initialCache: false,
key: hash(['何らかの文字列','何らかの文字列']),
});