$[client]

Clients are generated for each OpenAPI client specified in the openFetch section of Nuxt config and provide a convenient wrapper around $fetch.

Usage

You can access clients from the Vue context using useNuxtApp().

It has the same API as Nuxt's $fetch util with an additional path option, which is used to replace params in the pathname. For other options, see additional parameters.

<script setup lang="ts">
const { $pets } = useNuxtApp()

const data = await $pets('/pet/{petId}', {
  path: {
    petId: 12
  }
})
</script>

<template>
  <h1>{{ data?.name }}</h1>
</template>

or inside the Nitro handler:

export default defineEventHandler(async () => {
  const { $api } = useNitroApp()

  const data = await $pets('/pet/{petId}', {
    path: {
      petId: 12
    }
  })
})

Additional parameters

In addition to the $fetch options, the client accepts the following additional parameters:

path

• Type: Record<string, string | number>

The exact type of the path is generated from the OpenAPI schema for type safety and autocompletion. This option lets you replace the path parameters in the endpoint URL with the actual values.

accept

• Type: MediaType | MediaType[]

The exact type of the accept option is generated from the available response types in the OpenAPI schema. This option allows you to set the Accept header for the request and typeset the result type accordingly.

For more examples, see Response types.