<translate>

Deprecated

The <translate> component and v-translate directive have been deprecated, use the functions instead.

Since Vue 3, extracting messages from within components is awkward and error-prone as well as cause issues with server-side rendering.

To make the transition easier, they will keep working until a future major release.

Usage

<translate>Hello</translate>

<translate> renders a <span> by default, use tag to override.

<translate tag="h1">Hello</translate>

Parameters

If the parameter should change dynamically, use the :translate-params prop (or use the v-translate directive).

<translate :translate-params="{ name: 'Paul' }">Hello %{ name }!</translate>

Pluralization

<translate
  :translate-params="{ amount: 2 }"
  :translate-n="2"
  translate-plural="%{ amount } cars"
>
  %{ amount } car
</translate>

Props

Prop	Description	Type	Default
tag	HTML tag that contains the message	string	span
translate-n	Determines what plural form to apply to the message	number	null
translate-plural	Pluralized message	string	null
translate-context	Gettext translation context	string	null
translate-params	Parameters to interpolate messages	Object	null
translate-comment	Comment for the message id	string	null