API Reference

Extension of Vue

All Vue I18n properties and methods (like $t, $i18n, v-t directive and others) are also available even though they are not listed here. Below are only the ones that are added by @nuxtjs/i18n.

localePath()

  • Arguments:
    • route (type: string | Location)
    • locale (type: string, default: current locale)
  • Returns: string

Returns localized path for passed in route. If locale is not specified, uses current locale.

See also Basic usage - nuxt-link.

switchLocalePath()

  • Arguments:
    • locale: (type: string)
  • Returns: string

Returns path of the current route for specified locale.

See also Basic usage - nuxt-link.

See type definition for Location.

getRouteBaseName()

  • Arguments:
    • route (type: Route, default: current route)
  • Returns: string

Returns base name of current (if argument not provided) or passed in route. Base name is name of the route without locale suffix and other metadata added by @nuxtjs/i18n.

localeRoute()

Returns localized route for passed in route parameters. If locale is not specified, uses current locale.

See also Basic usage - nuxt-link.

localeLocation()

  • Arguments:
    • route (type: RawLocation)
    • locale (type: string, default: current locale)
  • Returns: Location | undefined

Returns localized location for passed in route parameters. If locale is not specified, uses current locale.

See also Basic usage - nuxt-link.

$nuxtI18nHead()

The options object accepts these optional properties:

  • addDirAttribute (type: boolean) - Adds a dir attribute to the HTML element. Default: false
  • addSeoAttributes (type: boolean | SeoAttributesOptions) - Adds various SEO attributes. Default: false

See also SEO.

Extension of VueI18n

Instance of VueI18n class (see its properties and methods) is exposed as $i18n on Vue instance and Vuex Store but as i18n on Nuxt context.app.

getLocaleCookie()

  • Arguments:
    • no arguments
  • Returns: string | undefined

Returns locale code from stored locale cookie.

setLocaleCookie()

  • Arguments:
    • locale (type: string)
  • Returns: undefined

Updates stored locale cookie with specified locale code. Consider using setLocale instead if you want to switch locale.

setLocale()

  • Arguments:
    • locale (type: string)
  • Returns: Promise<undefined>

Switches locale of the app to specified locale code. If useCookie option is enabled, locale cookie will be updated with new value. If prefixes are enabled (strategy other than no_prefix), will navigate to new locale's route.

getBrowserLocale()

  • Arguments:
    • no arguments
  • Returns: string | undefined

Returns browser locale code filtered against the ones defined in options.

finalizePendingLocaleChange()

  • Arguments:
    • no arguments
  • Returns: Promise<undefined>

Switches to the pending locale that would have been set on navigate, but was prevented by the option skipSettingLocaleOnNavigate. See more information in Wait for page transition.

waitForPendingLocaleChange()

  • Arguments:
    • no arguments
  • Returns: Promise<undefined>

Returns a promise that will be resolved once the pending locale is set.

defaultDirection

  • Type: Directions

Default direction as specified in options.

defaultLocale

  • Type: string

Default locale as specified in options.

localeCodes

  • Type: Array<string>

List of locale codes of registered locales.

locales

  • Type: Array<string | LocaleObject>

List of locales as defined in options.

localeProperties

  • Type: LocaleObject

Object of the current locale properties.

differentDomains

  • Type: boolean

Whether differentDomains option is enabled.

onBeforeLanguageSwitch

  • Type: Function

See callbacks

onLanguageSwitched

  • Type: Function

See callbacks

Extension of Nuxt Context

The following APIs are exposed both on context and context.app.

i18n

See also Nuxt context.

Can be accessed from asyncData and wherever context is available.

Example use:

export default Vue.extend({
  asyncData({ i18n }) {
    const locale = i18n.locale

    return {
      locale
    }
  }
})

getRouteBaseName()

localePath()

localeRoute()

localeLocation()

switchLocalePath()

See more info about those in Extension of Vue section.

Extension of Vuex

$i18n

Can be accessed in store's actions and mutations as this.$i18n.

Example use:

export const actions = {
  nuxtServerInit({ commit }) {
    commit('LOCALE', this.$i18n.locale)
  }
}

getRouteBaseName()

localePath()

localeRoute()

localeLocation()

switchLocalePath()

See more info about those in Extension of Vue section.

Edit this page on GitHub Updated at Mon, Oct 18, 2021