Nuxt bridge - Showing a loading indicator between pages

Question

I recently migrated a Nuxt 2 Project to Nuxt Bridge, and everything is working fine, except... the loading bar is not showing up between pages. The loading property in nuxt.config.js is only for Nuxt 2, and I can't integrate the <NuxtLoadingIndicator/> of Nuxt 3. I also tried to create a custom component that would react to hooks such as page:start, but I can't make them be called.

Any help would be appreciated!

Answer 1

You can refer to the code below:

const get = async ({page = 1}) => {
  const nuxtApp = useNuxtApp()
  nuxtApp.callHook('page:start')
  tokens.value = await $api.index<models.TokenResults>('/token', { page: page })
  nuxtApp.callHook('page:finish')
}

You can see the details in the link