Comment créer une copie de useFetch dans un hook personnalisé ?

Question

J'essaie de créer un hook qui peut être utilisé plusieurs fois, mais le comportement que j'obtiens n'est pas celui auquel je m'attends

/composables/fetch.ts

export const useFetchWithErrorHandler = async (url : chaîne, options ? : FetchOptions) =>
  const route = useRoute();
  const { API_BASE_URL, API_PREFIX } = useRuntimeConfig();

  console.log(url, options);

  renvoyer une nouvelle promesse (async (résolution, rejet) => {
    réponse const = attendre useFetch (API_PREFIX + url, {
      ...options,
      URL de base : API_BASE_URL,
      initialCache : faux,
      async onResponse({ requête, réponse, options }) {
        console.log('[récupérer la réponse]', réponse);
      },
      async onResponseError({ requête, réponse, options }) {
        console.log('[récupérer l'erreur de réponse]');
      },
    });
    résoudre (réponse);
  });
≪/pré>

<p>Déclenche uniquement la première requête</p>
<pre class="brush:js;toolbar:false;">const { data: réponse } = wait useFetchWithErrorHandler(`page-1`, {
    choisir : ['données'],
});

const { data : réponse } = wait useFetchWithErrorHandler(`page-2`, {
    choisir : ['données'],
});

Answer 1

useFetch Utilisez la mise en cache pour éviter plusieurs requêtes identiques.

Vous pouvez désactiver la mise en cache si vous définissez initialCache: false dans des options telles que

useFetch(API_PREFIX + url, {
    ...options,
    initialCache: false,
  }
)