Fetch Data even on page reload using custom Fetch Composable

I am trying to fetch data in a page. I am using a custom Fetch composable. But the fetch seems only to work when I navigate to the page using route links. This page uses a middleware but I think this is not the main concern

<script setup>
definePageMeta.....

const {data: data, pending: pending} = await useAuthFetch('/vendor/me');

<script setup>
definePageMeta.....

const {data: data, pending: pending} = await useAuthFetch('/vendor/me');

composable useAuthFetch:

import type { UseFetchOptions } from 'nuxt/app';

export function useAuthFetch<T>(
    url: string | (() => string),
    options: UseFetchOptions<T> = {}
) {
  return useFetch(url, {
    ...options,
    $fetch: useNuxtApp().$authFetch,
  })
}

import type { UseFetchOptions } from 'nuxt/app';

export function useAuthFetch<T>(
    url: string | (() => string),
    options: UseFetchOptions<T> = {}
) {
  return useFetch(url, {
    ...options,
    $fetch: useNuxtApp().$authFetch,
  })
}

Nuxt•2y ago•

8 replies

patchamamma

Fetch Data even on page reload using custom Fetch Composable

<script setup>
definePageMeta.....

const {data: data, pending: pending} = await useAuthFetch('/vendor/me');

<script setup>
definePageMeta.....

const {data: data, pending: pending} = await useAuthFetch('/vendor/me');

composable useAuthFetch:

import type { UseFetchOptions } from 'nuxt/app';

export function useAuthFetch<T>(
    url: string | (() => string),
    options: UseFetchOptions<T> = {}
) {
  return useFetch(url, {
    ...options,
    $fetch: useNuxtApp().$authFetch,
  })
}

import type { UseFetchOptions } from 'nuxt/app';

export function useAuthFetch<T>(
    url: string | (() => string),
    options: UseFetchOptions<T> = {}
) {
  return useFetch(url, {
    ...options,
    $fetch: useNuxtApp().$authFetch,
  })
}

Fetch Data even on page reload using custom Fetch Composable

Similar Threads

Fetch Data even on page reload using custom Fetch Composable

Similar Threads

Similar Threads

Similar Threads