useFetch を使用してキャッシュされたデータを Nuxt3 に保持する
P粉547420474
P粉547420474 2023-11-03 21:01:41
0
2
879

nuxt3 を使用しているときに次の問題が発生しました。

  • 動的ページ[slug].vue初期スラッグデータを正しくロードします
  • ページを離れて戻ってくると、新しいデータは読み込まれず、代わりに古いデータが表示されたままになります。
  • 上記のページを古いデータで更新すると、正常に動作します。

これは、新しいスラッグの API 呼び出しが行われないために発生するようです。

私の [slug.vue] ファイルは次のようになります:

リーリー

セットアップ全体は stackblitz で確認できます: https://stackblitz.com/edit/nuxt-starter-mkgfrw?file=pages/[slug].vue,pages/index.vue

P粉547420474
P粉547420474

全員に返信(2)
P粉523625080

デフォルトでは、useFetch、useLazyFetch、useAsyncData、および useLazyAsyncData はすべて、現在のブラウザー セッションで最初にフェッチされた初期応答ペイロードをキャッシュするため、その後の無駄な要求は行われません。 (少なくとも、それがその背後にある考えだと思います)

オプション「initialCache」を渡して「false」に設定することで、各フェッチ コンポーザブルのデフォルトの動作を変更できます。

参照: https://v3.nuxtjs.org/api /composables/use-async-data#params

いいねを押す +0
P粉464082061

上記のコメントの提案に従い、ここでドキュメントを確認してください: https://v3.nuxtjs.org/guide/features/data-fetching/#refreshing-data次のことを試しましたが、うまくいきましたコード### リーリー

ここでの実際の例:

https://stackblitz.com/edit/nuxt-starter-mkgfrw?file=pages/[slug].vue,app.vue

いいねを押す +0
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート