Composition API
Composer
Interfaces de Composer
Firma:
export interface Composer<Messages extends Record<string, any> = {}, DateTimeFormats extends Record<string, any> = {}, NumberFormats extends Record<string, any> = {}, OptionLocale = Locale, ResourceLocales = PickupLocales<NonNullable<Messages>> | PickupLocales<NonNullable<DateTimeFormats>> | PickupLocales<NonNullable<NumberFormats>>, Locales = Locale extends GeneratedLocale ? GeneratedLocale : OptionLocale extends Locale ? IsNever<ResourceLocales> extends true ? Locale : ResourceLocales : OptionLocale | ResourceLocales> extends ComposerCustomDetalles
Esta es la interfaz para ser utilizada con la Vue 3 Composition API.
availableLocales
Firma:
readonly availableLocales: ComputedRef<Locales[]>;Detalles
La lista de locales disponibles en messages en orden léxico.
d
Formato de fecha y hora
Firma:
d: ComposerDateTimeFormatting<DateTimeFormats, Locales, RemoveIndexSignature<{
[K in keyof DefineDateTimeFormat]: DefineDateTimeFormat[K];
}>>;Detalles
Para más detalles sobre las funciones, consulta ComposerDateTimeFormatting
datetimeFormats
Firma:
readonly datetimeFormats: ComputedRef<{
[K in keyof DateTimeFormats]: DateTimeFormats[K];
}>;Detalles
Los formatos de fecha y hora de localización.
Ver:
escapeParameter
Firma:
escapeParameter: boolean;Detalles
Si los parámetros de interpolación son escapados antes de que se traduzca el mensaje.
Ver:
fallbackFormat
Firma:
fallbackFormat: boolean;Detalles
Si suprimir advertencias al volver a usar fallbackLocale o raíz.
Ver:
fallbackLocale
Firma:
fallbackLocale: WritableComputedRef<FallbackLocales<Locales>>;Detalles
Los locales de fallback actuales que esta instancia de Composer está utilizando.
Ver:
fallbackRoot
Firma:
fallbackRoot: boolean;Detalles
Si se realiza un fallback al nivel raíz (ámbito global) de localización cuando falla la localización.
Ver:
fallbackWarn
Firma:
fallbackWarn: boolean | RegExp;Detalles
Si suprimir advertencias de fallback cuando falla la localización.
Ver:
id
Firma:
id: number;Detalles
ID de instancia.
inheritLocale
Firma:
inheritLocale: boolean;Detalles
Si hereda el locale de nivel raíz al locale de localización del componente.
Ver:
isGlobal
Firma:
readonly isGlobal: boolean;Detalles
Si esta instancia del compositor es global o no
locale
Firma:
locale: WritableComputedRef<Locales>;Detalles
El locale actual que esta instancia de Composer está utilizando.
Si el locale contiene un territorio y un dialecto, este locale contiene un fallback implícito.
Ver:
messages
Firma:
readonly messages: ComputedRef<{
[K in keyof Messages]: Messages[K];
}>;Detalles
Los mensajes de localización.
Ver:
missingWarn
Firma:
missingWarn: boolean | RegExp;Detalles
Si suprimir advertencias generadas cuando falla la localización.
Ver:
modifiers
Firma:
readonly modifiers: LinkedModifiers<VueMessageType>;Detalles
Modificadores personalizados para mensajes vinculados.
Ver:
n
Formato Numérico
Firma:
n: ComposerNumberFormatting<NumberFormats, Locales, RemoveIndexSignature<{
[K in keyof DefineNumberFormat]: DefineNumberFormat[K];
}>>;Detalles
Para más detalles sobre las funciones, consulta ComposerNumberFormatting
numberFormats
Firma:
readonly numberFormats: ComputedRef<{
[K in keyof NumberFormats]: NumberFormats[K];
}>;Detalles
Los formatos numéricos de localización.
Ver:
pluralRules
Firma:
readonly pluralRules: PluralizationRules;Detalles
Un conjunto de reglas para la pluralización de palabras
Ver:
rt
Resolver traducción de mensaje de localización
Firma:
rt: ComposerResolveLocaleMessageTranslation<Locales>;Detalles
Para más detalles sobre las funciones, consulta ComposerResolveLocaleMessageTranslation
t
Traducción de mensaje de localización
Firma:
t: ComposerTranslation<Messages, Locales, RemoveIndexSignature<{
[K in keyof DefineLocaleMessage]: DefineLocaleMessage[K];
}>>;Detalles
Para más detalles sobre las funciones, consulta ComposerTranslation
warnHtmlMessage
Firma:
warnHtmlMessage: boolean;Detalles
Si se permite el uso de mensajes de localización con formato HTML.
Si estableces false, verificará los mensajes de localización en la instancia de Composer.
Si especificas true, se mostrará una advertencia en la consola.
Ver:
getDateTimeFormat(locale)
Obtener formato de fecha y hora
Firma:
getDateTimeFormat<DateTimeSchema extends Record<string, any> = never, LocaleSchema extends string = string, Locale extends PickupLocales<NonNullable<DateTimeFormats>> = PickupLocales<NonNullable<DateTimeFormats>>, Return = IsNever<DateTimeSchema> extends true ? IsEmptyObject<DateTimeFormats> extends true ? RemoveIndexSignature<{
[K in keyof DefineDateTimeFormat]: DefineDateTimeFormat[K];
}> : NonNullable<DateTimeFormats>[Locale] : DateTimeSchema>(locale: LocaleSchema | Locale): Return;Parámetros de tipo
| Parámetro | Descripción |
|---|---|
| DateTimeSchema | Esquema de formato de fecha y hora, por defecto never |
Detalles
obtener formato de fecha y hora desde la instancia de Composer.
Parámetros
| Parámetro | Tipo | Descripción |
|---|---|---|
| locale | LocaleSchema | Locale | Un locale objetivo |
Retorna
Formato de fecha y hora
getLocaleMessage(locale)
Obtener mensaje de localización
Firma:
getLocaleMessage<MessageSchema extends LocaleMessage<VueMessageType> = never, LocaleSchema extends string = string, Locale extends PickupLocales<NonNullable<Messages>> = PickupLocales<NonNullable<Messages>>, Return = IsNever<MessageSchema> extends true ? IsEmptyObject<Messages> extends true ? RemoveIndexSignature<{
[K in keyof DefineLocaleMessage]: DefineLocaleMessage[K];
}> : NonNullable<Messages>[Locale] : MessageSchema>(locale: LocaleSchema | Locale): Return;Parámetros de tipo
| Parámetro | Descripción |
|---|---|
| MessageSchema | Esquema de mensaje de localización, por defecto never |
Detalles
obtener mensaje de localización desde la instancia de Composer.
Parámetros
| Parámetro | Tipo | Descripción |
|---|---|---|
| locale | LocaleSchema | Locale | Un locale objetivo |
Retorna
Mensajes de localización
getMissingHandler()
Obtener manejador de mensajes faltantes
Firma:
getMissingHandler(): MissingHandler | null;Parámetros
| Parámetro | Tipo | Descripción |
|---|
Retorna
getNumberFormat(locale)
Obtener formato numérico
Firma:
getNumberFormat<NumberSchema extends Record<string, any> = never, LocaleSchema extends string = string, Locale extends PickupLocales<NonNullable<NumberFormats>> = PickupLocales<NonNullable<NumberFormats>>, Return = IsNever<NumberSchema> extends true ? IsEmptyObject<NumberFormats> extends true ? RemoveIndexSignature<{
[K in keyof DefineNumberFormat]: DefineNumberFormat[K];
}> : NonNullable<NumberFormats>[Locale] : NumberSchema>(locale: LocaleSchema | Locale): Return;Parámetros de tipo
| Parámetro | Descripción |
|---|---|
| NumberSchema | Esquema de formato numérico, por defecto never |
Detalles
obtener formato numérico desde la instancia de Composer.
Parámetros
| Parámetro | Tipo | Descripción |
|---|---|---|
| locale | LocaleSchema | Locale | Un locale objetivo |
Retorna
Formato numérico
getPostTranslationHandler()
Obtener manejador de traducción posterior
Firma:
getPostTranslationHandler(): PostTranslationHandler<VueMessageType> | null;Parámetros
| Parámetro | Tipo | Descripción |
|---|
Retorna
mergeDateTimeFormat(locale, format)
Combinar formato de fecha y hora
Firma:
mergeDateTimeFormat<DateTimeSchema extends Record<string, any> = never, LocaleSchema extends string = string, Locale extends PickupLocales<NonNullable<DateTimeFormats>> = PickupLocales<NonNullable<DateTimeFormats>>, Formats = IsNever<DateTimeSchema> extends true ? Record<string, any> : DateTimeSchema>(locale: LocaleSchema | Locale, format: Formats): void;Parámetros de tipo
| Parámetro | Descripción |
|---|---|
| DateTimeSchema | Esquema de formato de fecha y hora, por defecto never |
Detalles
Combinar formato de fecha y hora a la instancia de Composer.
Parámetros
| Parámetro | Tipo | Descripción |
|---|---|---|
| locale | LocaleSchema | Locale | Un locale objetivo |
| format | Formats | Un formato de fecha y hora objetivo |
mergeLocaleMessage(locale, message)
Combinar mensaje de localización
Firma:
mergeLocaleMessage<MessageSchema extends LocaleMessage<VueMessageType> = never, LocaleSchema extends string = string, Locale extends PickupLocales<NonNullable<Messages>> = PickupLocales<NonNullable<Messages>>, Message = IsNever<MessageSchema> extends true ? Record<string, any> : MessageSchema>(locale: LocaleSchema | Locale, message: Message): void;Parámetros de tipo
| Parámetro | Descripción |
|---|---|
| MessageSchema | Esquema de mensaje de localización, por defecto never |
Detalles
Combinar mensaje de localización a la instancia de Composer.
Parámetros
| Parámetro | Tipo | Descripción |
|---|---|---|
| locale | LocaleSchema | Locale | Un locale objetivo |
| message | Message | Un mensaje |
mergeNumberFormat(locale, format)
Combinar formato numérico
Firma:
mergeNumberFormat<NumberSchema extends Record<string, any> = never, LocaleSchema extends string = string, Locale extends PickupLocales<NonNullable<NumberFormats>> = PickupLocales<NonNullable<NumberFormats>>, Formats = IsNever<NumberSchema> extends true ? Record<string, any> : NumberSchema>(locale: LocaleSchema | Locale, format: Formats): void;Parámetros de tipo
| Parámetro | Descripción |
|---|---|
| NumberSchema | Esquema de formato numérico, por defecto never |
Detalles
Combinar formato numérico a la instancia de Composer.
Parámetros
| Parámetro | Tipo | Descripción |
|---|---|---|
| locale | LocaleSchema | Locale | Un locale objetivo |
| format | Formats | Un formato numérico objetivo |
setDateTimeFormat(locale, format)
Establecer formato de fecha y hora
Firma:
setDateTimeFormat<DateTimeSchema extends Record<string, any> = never, LocaleSchema extends string = string, Locale extends PickupLocales<NonNullable<DateTimeFormats>> = PickupLocales<NonNullable<DateTimeFormats>>, FormatsType = IsNever<DateTimeSchema> extends true ? IsEmptyObject<DateTimeFormats> extends true ? RemoveIndexSignature<{
[K in keyof DefineDateTimeFormat]: DefineDateTimeFormat[K];
}> : NonNullable<DateTimeFormats>[Locale] : DateTimeSchema, Formats extends FormatsType = FormatsType>(locale: LocaleSchema | Locale, format: Formats): void;Parámetros de tipo
| Parámetro | Descripción |
|---|---|
| DateTimeSchema | Esquema de formato de fecha y hora, por defecto never |
Detalles
Establecer formato de fecha y hora en la instancia de Composer.
Parámetros
| Parámetro | Tipo | Descripción |
|---|---|---|
| locale | LocaleSchema | Locale | Un locale objetivo |
| format | Formats | Un formato de fecha y hora objetivo |
setLocaleMessage(locale, message)
Establecer mensaje de localización
Firma:
setLocaleMessage<MessageSchema extends LocaleMessage<VueMessageType> = never, LocaleSchema extends string = string, Locale extends PickupLocales<NonNullable<Messages>> = PickupLocales<NonNullable<Messages>>, MessageType = IsNever<MessageSchema> extends true ? IsEmptyObject<Messages> extends true ? RemoveIndexSignature<{
[K in keyof DefineLocaleMessage]: DefineLocaleMessage[K];
}> : NonNullable<Messages>[Locale] : MessageSchema, Message extends MessageType = MessageType>(locale: LocaleSchema | Locale, message: Message): void;Parámetros de tipo
| Parámetro | Descripción |
|---|---|
| MessageSchema | Esquema de mensaje de localización, por defecto never |
Detalles
Establecer mensaje de localización en la instancia de Composer.
Parámetros
| Parámetro | Tipo | Descripción |
|---|---|---|
| locale | LocaleSchema | Locale | Un locale objetivo |
| message | Message | Un mensaje |
setMissingHandler(handler)
Establecer manejador de mensajes faltantes
Firma:
setMissingHandler(handler: MissingHandler | null): void;Parámetros
| Parámetro | Tipo | Descripción |
|---|---|---|
| handler | MissingHandler | null | Un MissingHandler |
setNumberFormat(locale, format)
Establecer formato numérico
Firma:
setNumberFormat<NumberSchema extends Record<string, any> = never, LocaleSchema extends string = string, Locale extends PickupLocales<NonNullable<NumberFormats>> = PickupLocales<NonNullable<NumberFormats>>, FormatsType = IsNever<NumberSchema> extends true ? IsEmptyObject<NumberFormats> extends true ? RemoveIndexSignature<{
[K in keyof DefineNumberFormat]: DefineNumberFormat[K];
}> : NonNullable<NumberFormats>[Locale] : NumberSchema, Formats extends FormatsType = FormatsType>(locale: LocaleSchema | Locale, format: Formats): void;Parámetros de tipo
| Parámetro | Descripción |
|---|---|
| NumberSchema | Esquema de formato numérico, por defecto never |
Detalles
Establecer formato numérico en la instancia de Composer.
Parámetros
| Parámetro | Tipo | Descripción |
|---|---|---|
| locale | LocaleSchema | Locale | Un locale objetivo |
| format | Formats | Un formato numérico objetivo |
setPostTranslationHandler(handler)
Establecer manejador de traducción posterior
Firma:
setPostTranslationHandler(handler: PostTranslationHandler<VueMessageType> | null): void;Parámetros
| Parámetro | Tipo | Descripción |
|---|---|---|
| handler | PostTranslationHandler<VueMessageType> | null | Un |
te(key, locale)
Verificar existencia de traducción de mensaje de localización
Firma:
te<Str extends string, Key extends PickupKeys<Messages> = PickupKeys<Messages>>(key: Str | Key, locale?: Locales): boolean;Detalles
si existe o no un mensaje de localización en la instancia de Composer.
Si especificas locale, verifica los mensajes de localización de locale.
Parámetros
| Parámetro | Tipo | Descripción |
|---|---|---|
| key | Str | Key | Una clave de mensaje de localización objetivo |
| locale | Locales | Un locale, será utilizado sobre el ámbito global o local |
Retorna
Si se encuentra el mensaje de localización, true, de lo contrario false. Nótese que false se retorna incluso si el valor presente en la clave no es traducible, sin embargo si translateExistCompatible está configurado como true, retornará true si la clave está disponible, aun cuando el valor no sea traducible.
tm(key)
Obtener mensajes de localización
Firma:
tm<Key extends string, ResourceKeys extends PickupKeys<Messages> = PickupKeys<Messages>, Locale extends PickupLocales<NonNullable<Messages>> = PickupLocales<NonNullable<Messages>>, Target = IsEmptyObject<Messages> extends false ? NonNullable<Messages>[Locale] : RemoveIndexSignature<{
[K in keyof DefineLocaleMessage]: DefineLocaleMessage[K];
}>, Return = ResourceKeys extends ResourcePath<Target> ? ResourceValue<Target, ResourceKeys> : Record<string, any>>(key: Key | ResourceKeys): Return;Detalles
Si I18nScope es 'local' o algunos UseI18nOptions son especificados en useI18n, la traducción se hace preferentemente usando mensajes de localización del ámbito local antes que los del ámbito global.
Basado en el locale actual, se devolverán los mensajes de localización de la instancia de Composer.
Si cambias el locale, los mensajes de localización devueltos también corresponderán al nuevo locale.
Si no hay mensajes de localización para la key dada en los mensajes de la instancia de Composer, serán devueltos mediante fallbacking.
[!WARNING] Necesitas usar rt para los mensajes de localización devueltos por tm. Ver los detalles de rt.
Parámetros
| Parámetro | Tipo | Descripción |
|---|---|---|
| key | Key | ResourceKeys | Una clave de mensaje de localización objetivo |
Retorna
Mensajes de localización
Ejemplos
Bloque plantilla:
<div class="container">
<template v-for="content in tm('contents')">
<h2>{{ rt(content.title) }}</h2>
<p v-for="paragraph in content.paragraphs">
{{ rt(paragraph) }}
</p>
</template>
</div>Bloque script:
import { defineComponent } from 'vue
import { useI18n } from 'vue-i18n'
export default defineComponent({
setup() {
const { rt, tm } = useI18n({
messages: {
en: {
contents: [
{
title: 'Title1',
// ...
paragraphs: [
// ...
]
}
]
}
}
// ...
})
// ...
return { ... , rt, tm }
}
})ComposerAdditionalOptions
Opciones adicionales de Composer para useI18n
Firma:
export interface ComposerAdditionalOptionsDetalles
ComposerAdditionalOptions extiende ComposerOptions, por lo tanto puedes especificar estas opciones.
useScope
ComposerCustom
Definición personalizada del tipo Composer
Firma:
export interface ComposerCustomDetalles
La interfaz que puede extender Composer.
El tipo definido por terceros (ej. nuxt/i18n)
Ejemplos
// vue-i18n.d.ts (archivo `.d.ts` en tu aplicación)
declare module 'vue-i18n' {
interface ComposerCustom {
localeCodes: string[]
}
}ComposerDateTimeFormatting
Funciones de formato de fecha y hora
Firma:
export interface ComposerDateTimeFormatting<DateTimeFormats extends Record<string, any> = {}, Locales = 'en-US', DefinedDateTimeFormat extends RemovedIndexResources<DefineDateTimeFormat> = RemovedIndexResources<DefineDateTimeFormat>, C = IsEmptyObject<DefinedDateTimeFormat> extends false ? PickupFormatPathKeys<{
[K in keyof DefinedDateTimeFormat]: DefinedDateTimeFormat[K];
}> : never, M = IsEmptyObject<DateTimeFormats> extends false ? PickupFormatKeys<DateTimeFormats> : never, ResourceKeys extends C | M = IsNever<C> extends false ? IsNever<M> extends false ? C | M : C : IsNever<M> extends false ? M : never>Detalles
Esta es la interfaz para Composer
(value: number | Date | string): string;
Formato de fecha y hora
Firma:
(value: number | Date | string): string;Detalles
Si esto se usa en un contexto reactivo, se evaluará nuevamente una vez que cambie el locale.
Si 'local' o algunos UseI18nOptions son especificados en useI18n, se traduce preferentemente usando formatos de fecha y hora del ámbito local antes que los del ámbito global.
De lo contrario, se formatea con formatos de fecha y hora del ámbito global.
Ver:
Parámetros
| Parámetro | Tipo | Descripción |
|---|---|---|
| value | number | Date | string | Un valor, número de timestamp o instancia de Date o cadena ISO 8601 |
Retorna
Valor formateado
(value: Value, keyOrOptions: OptionsType): IsPart<OptionsType> extends true ? Intl.DateTimeFormatPart[] : string;
Formato de fecha y hora
Firma:
<Value extends number | Date | string = number, Key extends string = string, OptionsType extends Key | ResourceKeys | DateTimeOptions<Key | ResourceKeys, Locales> = Key | ResourceKeys | DateTimeOptions<Key | ResourceKeys, Locales>>(value: Value, keyOrOptions: OptionsType): IsPart<OptionsType> extends true ? Intl.DateTimeFormatPart[] : string;Detalles
Sobrecarga d.
En esta sobrecarga d, se formatea en formato de fecha y hora para una clave registrada en formatos de fecha y hora.
Parámetros
| Parámetro | Tipo | Descripción |
|---|---|---|
| value | Value | Un valor, número de timestamp o instancia de Date o cadena ISO 8601 |
| keyOrOptions | OptionsType | Una clave de formatos de fecha y hora o adicionales para formato de fecha y hora |
Retorna
Valor formateado
(value: Value, keyOrOptions: OptionsType, locale: Locales): IsPart<OptionsType> extends true ? Intl.DateTimeFormatPart[] : string;
Formato de fecha y hora
Firma:
<Value extends number | Date | string = number, Key extends string = string, OptionsType extends Key | ResourceKeys | DateTimeOptions<Key | ResourceKeys, Locales> = Key | ResourceKeys | DateTimeOptions<Key | ResourceKeys, Locales>>(value: Value, keyOrOptions: OptionsType, locale: Locales): IsPart<OptionsType> extends true ? Intl.DateTimeFormatPart[] : string;Detalles
Sobrecarga d.
En esta sobrecarga d, se formatea en formato de fecha y hora para una clave registrada en formatos de fecha y hora en el locale objetivo.
Parámetros
| Parámetro | Tipo | Descripción |
|---|---|---|
| value | Value | Un valor, número de timestamp o instancia de Date o cadena ISO 8601 |
| keyOrOptions | OptionsType | Una clave de formatos de fecha y hora o adicionales para formato de fecha y hora |
| locale | Locales | Un locale, será utilizado sobre el ámbito global o local. |
Retorna
Valor formateado
ComposerNumberFormatting
Funciones de formato numérico
Firma:
export interface ComposerNumberFormatting<NumberFormats extends Record<string, any> = {}, Locales = 'en-US', DefinedNumberFormat extends RemovedIndexResources<DefineNumberFormat> = RemovedIndexResources<DefineNumberFormat>, C = IsEmptyObject<DefinedNumberFormat> extends false ? PickupFormatPathKeys<{
[K in keyof DefinedNumberFormat]: DefinedNumberFormat[K];
}> : never, M = IsEmptyObject<NumberFormats> extends false ? PickupFormatKeys<NumberFormats> : never, ResourceKeys extends C | M = IsNever<C> extends false ? IsNever<M> extends false ? C | M : C : IsNever<M> extends false ? M : never>Detalles
Esta es la interfaz para Composer
(value: number): string;
Formato Numérico
Firma:
(value: number): string;Detalles
Si esto se usa en un contexto reactivo, se evaluará nuevamente una vez que cambie el locale.
Si 'local' o algunos UseI18nOptions son especificados en useI18n, se traduce preferentemente usando formatos de fecha y hora del ámbito local antes que los del ámbito global.
De lo contrario, se formatea con formatos numéricos del ámbito global.
Ver:
Parámetros
| Parámetro | Tipo | Descripción |
|---|---|---|
| value | number | Un valor numérico |
Retorna
Valor formateado
(value: number, keyOrOptions: OptionsType): IsPart<OptionsType> extends true ? Intl.NumberFormatPart[] : string;
Formato Numérico
Firma:
<Key extends string = string, OptionsType extends Key | ResourceKeys | NumberOptions<Key | ResourceKeys, Locales> = Key | ResourceKeys | NumberOptions<Key | ResourceKeys, Locales>>(value: number, keyOrOptions: OptionsType): IsPart<OptionsType> extends true ? Intl.NumberFormatPart[] : string;Detalles
Sobrecarga n.
En esta sobrecarga n, se formatea en formato numérico para una clave registrada en formatos numéricos.
Parámetros
| Parámetro | Tipo | Descripción |
|---|---|---|
| value | number | Un valor numérico |
| keyOrOptions | OptionsType | Una clave de formatos numéricos o adicionales para formato numérico |
Retorna
Valor formateado
(value: number, keyOrOptions: OptionsType, locale: Locales): IsPart<OptionsType> extends true ? Intl.NumberFormatPart[] : string;
Formato Numérico
Firma:
<Key extends string = string, OptionsType extends Key | ResourceKeys | NumberOptions<Key | ResourceKeys, Locales> = Key | ResourceKeys | NumberOptions<Key | ResourceKeys, Locales>>(value: number, keyOrOptions: OptionsType, locale: Locales): IsPart<OptionsType> extends true ? Intl.NumberFormatPart[] : string;Detalles
Sobrecarga n.
En esta sobrecarga n, se formatea en formato numérico para una clave registrada en formatos numéricos en el locale objetivo.
Parámetros
| Parámetro | Tipo | Descripción |
|---|---|---|
| value | number | Un valor numérico |
| keyOrOptions | OptionsType | Una clave de formatos numéricos o adicionales para formato numérico |
| locale | Locales | Un locale, será utilizado sobre el ámbito global o local. |
Retorna
Valor formateado
ComposerOptions
Opciones de Composer
Firma:
export interface ComposerOptions<Schema extends {
message?: unknown;
datetime?: unknown;
number?: unknown;
} = {
message: DefaultLocaleMessageSchema;
datetime: DefaultDateTimeFormatSchema;
number: DefaultNumberFormatSchema;
}, Locales extends {
messages: unknown;
datetimeFormats: unknown;
numberFormats: unknown;
} | string = Locale, MessagesLocales = Locales extends {
messages: infer M;
} ? M : Locales extends string ? Locales : Locale, DateTimeFormatsLocales = Locales extends {
datetimeFormats: infer D;
} ? D : Locales extends string ? Locales : Locale, NumberFormatsLocales = Locales extends {
numberFormats: infer N;
} ? N : Locales extends string ? Locales : Locale, MessageSchema = Schema extends {
message: infer M;
} ? M : DefaultLocaleMessageSchema, DateTimeSchema = Schema extends {
datetime: infer D;
} ? D : DefaultDateTimeFormatSchema, NumberSchema = Schema extends {
number: infer N;
} ? N : DefaultNumberFormatSchema, _Messages extends LocaleMessages<MessageSchema, MessagesLocales, VueMessageType> = LocaleMessages<MessageSchema, MessagesLocales, VueMessageType>, _DateTimeFormats extends DateTimeFormatsType<DateTimeSchema, DateTimeFormatsLocales> = DateTimeFormatsType<DateTimeSchema, DateTimeFormatsLocales>, _NumberFormats extends NumberFormatsType<NumberSchema, NumberFormatsLocales> = NumberFormatsType<NumberSchema, NumberFormatsLocales>>Detalles
Estas son las opciones para crear un compositor.
datetime
datetimeFormats
escapeParameter
Firma:
escapeParameter?: boolean;Detalles
Si escapeParameter está configurado como true, entonces los parámetros de interpolación son escapados antes de que se traduzca el mensaje.
Esto es útil cuando la salida de traducción se usa en v-html y el recurso de traducción contiene marcado HTML (por ejemplo, alrededor de un valor proporcionado por el usuario).
Este patrón de uso ocurre principalmente al pasar cadenas de texto precalculadas a componentes de interfaz.
El proceso de escape implica reemplazar los siguientes símbolos con sus respectivas entidades de caracteres HTML: <, >, ", '.
Establecer escapeParameter como true no debería romper la funcionalidad existente pero proporciona una protección contra ciertos vectores de ataque XSS.
Ver:
false
fallbackFormat
Firma:
fallbackFormat?: boolean;Detalles
Si hacer interpolación de plantillas en claves de traducción cuando tu idioma carece de traducción para una clave.
Si true, salta escribir plantillas para tu idioma "base"; las claves son tus plantillas.
Ver:
false
fallbackLocale
Firma:
fallbackLocale?: FallbackLocale;Detalles
El locale de localización de fallback.
Para definiciones más complejas de fallback, ver fallback.
Ver:
El valor por defecto 'en-US' para locale si no se especifica, o su valor locale
fallbackRoot
Firma:
fallbackRoot?: boolean;Detalles
En la localización del componente, si hacer fallback al nivel raíz (ámbito global) de localización cuando falla la localización.
Si false, no se hace fallback a la raíz.
Ver:
true
fallbackWarn
Firma:
fallbackWarn?: boolean | RegExp;Detalles
Si suprimir advertencias al hacer fallback a fallbackLocale o raíz.
Si false, se suprimen las advertencias de fallback.
Si usas expresión regular, puedes suprimir advertencias de fallback que coincidan con la clave de traducción (por ejemplo, t).
Ver:
true
flatJson
Firma:
flatJson?: boolean;Detalles
Permitir el uso de mensajes JSON planos o no
false
inheritLocale
Firma:
inheritLocale?: boolean;Detalles
Si heredar el locale de nivel raíz al locale de localización del componente.
Si false, independientemente del locale de nivel raíz, se localiza para cada locale de componente.
Ver:
true
locale
Firma:
locale?: Locale;Detalles
El locale de localización.
Si el locale contiene un territorio y un dialecto, este locale contiene un fallback implícito.
Ver:
'en-US'
message
messageCompiler
Firma:
messageCompiler?: MessageCompiler;Detalles
Un compilador para formato de mensaje personalizado.
Si no se especifica, se utilizará el compilador de mensaje por defecto de vue-i18n.
Necesitarás implementar tu propio compilador de mensaje que retorne Funciones de Mensaje.
Ejemplos
Aquí hay un ejemplo de cómo personalizar el compilador de mensaje con intl-messageformat
import { createI18n } from 'vue-i18n'
import IntlMessageFormat from 'intl-messageformat'
function messageCompiler(message, { locale, key, onError }) {
if (typeof message === 'string') {
// Puedes optimizar el rendimiento de tu compilador de mensaje con tu estrategia de caché o memoización aquí
const formatter = new IntlMessageFormat(message, locale)
return ctx => formatter.format(ctx.values)
} else {
// Si quieres soportarlo para AST,
// Necesitas transformar mensajes de localización tales como `json`, `yaml`, etc. con el plugin de empaquetado.
onError && onError(new Error('not support for AST'))
return () => key // retornar por defecto con `key`
}
}
// llamado con opción I18n
const i18n = createI18n({
locale: 'ja',
messageCompiler, // establecer tu compilador de mensaje
messages: {
en: {
hello: 'hello world!',
greeting: 'hi, {name}!',
// Formato de mensaje ICU
photo: `You have {numPhotos, plural,
=0 {no photos.}
=1 {one photo.}
other {# photos.}
}`
},
}
})
// el siguiente es algo que hagas ...
// ...[!TIP] 🆕 v9.3+
[!WARNING] El Formato de Mensaje Personalizado es una función experimental. Puede recibir cambios rotos o ser removida en el futuro.
Ver:
undefined
messageResolver
Firma:
messageResolver?: MessageResolver;Detalles
Un resolutor de mensaje a resolver.
Si no se especifica, se utilizará por defecto el resolutor de mensaje interno de vue-i18n.
Necesitas implementar tú mismo un resolutor de mensaje que soporte los siguientes requisitos:
Resuelve el mensaje usando el mensaje de localización pasado como primer argumento del resolutor de mensaje, y la ruta pasada como segundo argumento.
Si el mensaje no se pudo resolver, necesitas retornar
null.Si se retorna
null, el resolutor de mensaje también será llamado en fallback si está activado, por lo tanto el mensaje también necesita resolverse.
El resolutor de mensaje es llamado indirectamente por las siguientes APIs:
Ejemplos
Aquí está un ejemplo de cómo configurarlo usando tu createI18n:
import { createI18n } from 'vue-i18n'
// tu resolutor de mensaje
function messageResolver(obj, path) {
// ¡simple resolución de mensaje!
const msg = obj[path]
return msg != null ? msg : null
}
// llamado con opción I18n
const i18n = createI18n({
locale: 'ja',
messageResolver, // establecer tu resolutor de mensaje
messages: {
en: { ... },
ja: { ... }
}
})
// el siguiente es algo que hagas ...
// ...[!TIP] 🆕 v9.2+
[!WARNING] Si usas el resolutor de mensaje, la configuración de será ignorada. Es decir, necesitas resolver el JSON plano tú mismo.
Ver:
undefined
messages
missing
Firma:
missing?: MissingHandler;Detalles
Un manejador para la falta de localización.
El manejador es llamado con el locale objetivo de localización, la clave de ruta de localización, la instancia de Vue y valores.
Si se asigna un manejador de ausentes, y ocurre una falta de localización, no se muestra una advertencia.
null
missingWarn
Firma:
missingWarn?: boolean | RegExp;Detalles
Si suprimir advertencias generadas cuando falla la localización.
Si false, se suprimen las advertencias de fallo de localización.
Si usas expresión regular, puedes suprimir advertencias de fallo de localización que coinciden con la clave de traducción (por ejemplo, t).
Ver:
true
modifiers
Firma:
modifiers?: LinkedModifiers<VueMessageType>;Detalles
Modificadores personalizados para mensajes vinculados.
Ver:
number
numberFormats
pluralRules
Firma:
pluralRules?: PluralizationRules;Detalles
Un conjunto de reglas para la pluralización de palabras
Ver:
{}
postTranslation
Firma:
postTranslation?: PostTranslationHandler<VueMessageType>;Detalles
Un manejador para procesamiento posterior de la traducción.
El manejador es llamado después de ser invocado con t.
Este manejador es útil si quieres filtrar texto traducido, como recortar espacios.
null
warnHtmlMessage
Firma:
warnHtmlMessage?: boolean;Detalles
Si se permite el uso de mensajes de localización con formato HTML.
Ver la propiedad warnHtmlMessage.
Ver:
true
ComposerResolveLocaleMessageTranslation
Funciones de resolución de traducción de mensaje de localización
Firma:
export interface ComposerResolveLocaleMessageTranslation<Locales = 'en-US'>Detalles
Esta es la interfaz para Composer
(message: MessageFunction<VueMessageType> | VueMessageType): string;
Resolver traducción de mensaje de localización
Firma:
(message: MessageFunction<VueMessageType> | VueMessageType): string;Detalles
Si esto se usa en un contexto reactivo, se evaluará nuevamente una vez que cambie el locale.
Si 'local' o algunos UseI18nOptions son especificados en useI18n, se traduce preferentemente usando mensajes de localización del ámbito local antes que los del ámbito global.
De lo contrario, se traduce con mensajes de localización del ámbito global.
[!TIP] El caso de uso para rt es para traducción de mensajes de localización programáticos usando tm, v-for, sentencia javascript for.
[!WARNING] rt difiere de t en que procesa directamente el mensaje de localización, no la clave del mensaje de localización. No hay fallback interno con rt. Necesitas entender y usar la estructura del mensaje de localización devuelto por tm.
Ver:
Parámetros
| Parámetro | Tipo | Descripción |
|---|---|---|
| message | MessageFunction<VueMessageType> | VueMessageType | Un mensaje de localización objetivo a resolver. Necesitas especificar el mensaje de localización devuelto por tm. |
Retorna
Mensaje traducido
(message: MessageFunction<VueMessageType> | VueMessageType, plural: number, options?: TranslateOptions<Locales>): string;
Resolver traducción de mensaje de localización para plurales
Firma:
(message: MessageFunction<VueMessageType> | VueMessageType, plural: number, options?: TranslateOptions<Locales>): string;Detalles
Sobrecarga rt.
En esta sobrecarga rt, retorna un mensaje de traducción pluralizado.
[!TIP] El caso de uso para rt es para traducción de mensajes de localización programáticos usando tm, v-for, sentencia javascript for.
[!WARNING] rt difiere de t en que procesa directamente el mensaje de localización, no la clave del mensaje de localización. No hay fallback interno con rt. Necesitas entender y usar la estructura del mensaje de localización devuelto por tm.
Ver:
Parámetros
| Parámetro | Tipo | Descripción |
|---|---|---|
| message | MessageFunction<VueMessageType> | VueMessageType | Un mensaje de localización objetivo a resolver. Necesitas especificar el mensaje de localización devuelto por tm. |
| plural | number | Cuál cadena plural obtener. 1 retorna la primera. |
| options | TranslateOptions<Locales> | Adicionales para traducción |
Retorna
Mensaje traducido
(message: MessageFunction<VueMessageType> | VueMessageType, list: unknown[], options?: TranslateOptions<Locales>): string;
Resolver traducción de mensaje de localización para interpolaciones de listas
Firma:
(message: MessageFunction<VueMessageType> | VueMessageType, list: unknown[], options?: TranslateOptions<Locales>): string;Detalles
Sobrecarga rt.
En esta sobrecarga rt, retorna un mensaje de traducción pluralizado.
[!TIP] El caso de uso para rt es para traducción de mensajes de localización programáticos usando tm, v-for, sentencia javascript for.
[!WARNING] rt difiere de t en que procesa directamente el mensaje de localización, no la clave del mensaje de localización. No hay fallback interno con rt. Necesitas entender y usar la estructura del mensaje de localización devuelto por tm.
Ver:
Parámetros
| Parámetro | Tipo | Descripción |
|---|---|---|
| message | MessageFunction<VueMessageType> | VueMessageType | Un mensaje de localización objetivo a resolver. Necesitas especificar el mensaje de localización devuelto por tm. |
| list | unknown[] | Valores de interpolación de lista. |
| options | TranslateOptions<Locales> | Adicionales para traducción |
Retorna
Mensaje traducido
(message: MessageFunction<VueMessageType> | VueMessageType, named: NamedValue, options?: TranslateOptions<Locales>): string;
Resolver traducción de mensaje de localización para interpolaciones nombradas
Firma:
(message: MessageFunction<VueMessageType> | VueMessageType, named: NamedValue, options?: TranslateOptions<Locales>): string;Detalles
Sobrecarga rt.
En esta sobrecarga rt, para cada marcador de posición x, los mensajes de localización deben contener un token {x}.
[!TIP] El caso de uso para rt es para traducción de mensajes de localización programáticos usando tm, v-for, sentencia javascript for.
[!WARNING] rt difiere de t en que procesa directamente el mensaje de localización, no la clave del mensaje de localización. No hay fallback interno con rt. Necesitas entender y usar la estructura del mensaje de localización devuelto por tm.
Ver:
Parámetros
| Parámetro | Tipo | Descripción |
|---|---|---|
| message | MessageFunction<VueMessageType> | VueMessageType | Un mensaje de localización objetivo a resolver. Necesitas especificar el mensaje de localización devuelto por tm. |
| named | NamedValue | Valores de interpolación nombrada. |
| options | TranslateOptions<Locales> | Adicionales para traducción |
Retorna
Mensaje traducido
ComposerTranslation
Funciones de traducción de mensaje de localización
Firma:
export interface ComposerTranslation<Messages extends Record<string, any> = {}, Locales = 'en-US', DefinedLocaleMessage extends RemovedIndexResources<DefineLocaleMessage> = RemovedIndexResources<DefineLocaleMessage>, C = IsEmptyObject<DefinedLocaleMessage> extends false ? JsonPaths<{
[K in keyof DefinedLocaleMessage]: DefinedLocaleMessage[K];
}> : never, M = IsEmptyObject<Messages> extends false ? TranslationsPaths<Messages> : never, ResourceKeys extends C | M = IsNever<C> extends false ? IsNever<M> extends false ? C | M : C : IsNever<M> extends false ? M : never>Detalles
Esta es la interfaz para Composer
(key: Key | ResourceKeys | number): string;
Traducción de mensaje de localización
Firma:
<Key extends string>(key: Key | ResourceKeys | number): string;Detalles
Si esto se usa en un contexto reactivo, se evaluará nuevamente una vez que cambie el locale.
Si I18nScope es 'local' o algunos UseI18nOptions son especificados en useI18n, se traduce preferentemente usando mensajes de localización del ámbito local antes que los del ámbito global.
De lo contrario, se traduce con mensajes de localización del ámbito global.
Ver:
Parámetros
| Parámetro | Tipo | Descripción |
|---|---|---|
| key | Key | ResourceKeys | number | Una clave de mensaje de localización objetivo |
Retorna
Mensaje traducido
(key: Key | ResourceKeys | number, named: NamedValue): string;
Traducción de mensaje de localización para interpolaciones nombradas
Firma:
<Key extends string>(key: Key | ResourceKeys | number, named: NamedValue): string;Detalles
Sobrecarga t.
En esta sobrecarga t, para cada marcador de posición x, los mensajes de localización deben contener un token {x}.
También puedes suprimir la advertencia, cuando la traducción falta según las opciones.
Ver:
Parámetros
| Parámetro | Tipo | Descripción |
|---|---|---|
| key | Key | ResourceKeys | number | Una clave de mensaje de localización objetivo |
| named | NamedValue | Valores de interpolación nombrada |
Retorna
Mensaje traducido
(key: Key | ResourceKeys | number, named: NamedValue, plural: number): string;
Traducción de mensaje de localización para interpolaciones nombradas y plurales
Firma:
<Key extends string>(key: Key | ResourceKeys | number, named: NamedValue, plural: number): string;Detalles
Sobrecarga t.
En esta sobrecarga t, para cada marcador de posición x, los mensajes de localización deben contener un token {x}, y retorna un mensaje de traducción pluralizado.
Ver:
Parámetros
| Parámetro | Tipo | Descripción |
|---|---|---|
| key | Key | ResourceKeys | number | Una clave de mensaje de localización objetivo |
| named | NamedValue | Valores de interpolación nombrada |
| plural | number | Cuál cadena plural obtener. 1 retorna la primera. |
Retorna
Mensaje traducido
(key: Key | ResourceKeys | number, named: NamedValue, defaultMsg: string): string;
Traducción de mensaje de localización para interpolaciones nombradas y plurales
Firma:
<Key extends string>(key: Key | ResourceKeys | number, named: NamedValue, defaultMsg: string): string;Detalles
Sobrecarga t.
En esta sobrecarga t, para cada marcador de posición x, los mensajes de localización deben contener un token {x}, y si no se encuentra traducción, retorna un mensaje por defecto.
Ver:
Parámetros
| Parámetro | Tipo | Descripción |
|---|---|---|
| key | Key | ResourceKeys | number | Una clave de mensaje de localización objetivo |
| named | NamedValue | Valores de interpolación nombrada |
| defaultMsg | string | Un mensaje por defecto para retornar si no se encuentra traducción |
Retorna
Mensaje traducido
(key: Key | ResourceKeys | number, named: NamedValue, options: TranslateOptions<Locales>): string;
Traducción de mensaje de localización para interpolaciones nombradas
Firma:
<Key extends string>(key: Key | ResourceKeys | number, named: NamedValue, options: TranslateOptions<Locales>): string;Detalles
Sobrecarga t.
En esta sobrecarga t, para cada marcador de posición x, los mensajes de localización deben contener un token {x}.
También puedes suprimir la advertencia, cuando la traducción falta según las opciones.
Ver detalles de opciones, consulta la .
Cómo usar en detalle:
Parámetros
| Parámetro | Tipo | Descripción |
|---|---|---|
| key | Key | ResourceKeys | number | Una clave de mensaje de localización objetivo |
| named | NamedValue | Valores de interpolación nombrada |
| options | TranslateOptions<Locales> | Adicionales para traducción |
Retorna
Mensaje traducido
(key: Key | ResourceKeys | number, plural: number): string;
Traducción de mensaje de localización para plurales
Firma:
<Key extends string>(key: Key | ResourceKeys | number, plural: number): string;Detalles
Sobrecarga t.
En esta sobrecarga t, retorna un mensaje de traducción pluralizado.
También puedes suprimir la advertencia, cuando la traducción falta según las opciones.
Ver:
Parámetros
| Parámetro | Tipo | Descripción |
|---|---|---|
| key | Key | ResourceKeys | number | Una clave de mensaje de localización objetivo |
| plural | number | Cuál cadena plural obtener. 1 retorna la primera. |
Retorna
Mensaje traducido
(key: Key | ResourceKeys | number, plural: number, options: TranslateOptions<Locales>): string;
Traducción de mensaje de localización para plurales
Firma:
<Key extends string>(key: Key | ResourceKeys | number, plural: number, options: TranslateOptions<Locales>): string;Detalles
Sobrecarga t.
En esta sobrecarga t, retorna un mensaje de traducción pluralizado.
También puedes suprimir la advertencia, cuando la traducción falta según las opciones.
Ver detalles de opciones, consulta la .
Ver:
Parámetros
| Parámetro | Tipo | Descripción |
|---|---|---|
| key | Key | ResourceKeys | number | Una clave de mensaje de localización objetivo |
| plural | number | Cuál cadena plural obtener. 1 retorna la primera. |
| options | TranslateOptions<Locales> | Adicionales para traducción |
Retorna
Mensaje traducido
(key: Key | ResourceKeys | number, defaultMsg: string): string;
Traducción de mensaje de localización para mensaje por defecto faltante
Firma:
<Key extends string>(key: Key | ResourceKeys | number, defaultMsg: string): string;Detalles
Sobrecarga t.
En esta sobrecarga t, si no se encuentra traducción, retorna un mensaje por defecto.
También puedes suprimir la advertencia, cuando la traducción falta según las opciones.
Parámetros
| Parámetro | Tipo | Descripción |
|---|---|---|
| key | Key | ResourceKeys | number | Una clave de mensaje de localización objetivo |
| defaultMsg | string | Un mensaje por defecto para retornar si no se encuentra traducción |
Retorna
Mensaje traducido
(key: Key | ResourceKeys | number, defaultMsg: string, options: TranslateOptions<Locales>): string;
Traducción de mensaje de localización para mensaje por defecto faltante
Firma:
<Key extends string>(key: Key | ResourceKeys | number, defaultMsg: string, options: TranslateOptions<Locales>): string;Detalles
Sobrecarga t.
En esta sobrecarga t, si no se encuentra traducción, retorna un mensaje por defecto.
También puedes suprimir la advertencia, cuando la traducción falta según las opciones.
Ver detalles de opciones, consulta la .
Parámetros
| Parámetro | Tipo | Descripción |
|---|---|---|
| key | Key | ResourceKeys | number | Una clave de mensaje de localización objetivo |
| defaultMsg | string | Un mensaje por defecto para retornar si no se encuentra traducción |
| options | TranslateOptions<Locales> | Adicionales para traducción |
Retorna
Mensaje traducido
(key: Key | ResourceKeys | number, list: unknown[]): string;
Traducción de mensaje de localización para interpolaciones de lista
Firma:
<Key extends string>(key: Key | ResourceKeys | number, list: unknown[]): string;Detalles
Sobrecarga t.
En esta sobrecarga t, los mensajes de localización deben contener {0}, {1}, … para cada marcador de posición en la lista.
También puedes suprimir la advertencia, cuando la traducción falta según las opciones.
Ver:
Parámetros
| Parámetro | Tipo | Descripción |
|---|---|---|
| key | Key | ResourceKeys | number | Una clave de mensaje de localización objetivo |
| list | unknown[] | Valores de interpolación de lista |
Retorna
Mensaje traducido
(key: Key | ResourceKeys | number, list: unknown[], plural: number): string;
Traducción de mensaje de localización para interpolaciones de lista y plurales
Firma:
<Key extends string>(key: Key | ResourceKeys | number, list: unknown[], plural: number): string;Details
Sobrecarga de t.
En esta sobrecarga de t, los mensajes de localización deben contener un {0}, {1}, etc., por cada marcador de posición en la lista y devolver un mensaje de traducción con pluralización.
Consultar:
Parámetros
| Parámetro | Tipo | Descripción |
|---|---|---|
| key | Key | ResourceKeys | number | Una clave de mensaje de localización objetivo |
| list | unknown[] | Valores para la interpolación de lista |
| plural | number | Cuál cadena en plural obtener. 1 devuelve la primera. |
Devuelve
Mensaje traducido
(key: Key | ResourceKeys | number, list: unknown[], defaultMsg: string): string;
Traducción de mensajes de localización para interpolaciones de lista y mensaje predeterminado faltante
Firma:
<Key extends string>(key: Key | ResourceKeys | number, list: unknown[], defaultMsg: string): string;Detalles
Sobrecarga de t.
Consultar:
En esta sobrecarga de t, los mensajes de localización deben contener un {0}, {1}, etc., por cada marcador de posición en la lista, y si no se encuentra una traducción, se devuelve un mensaje predeterminado.
Parámetros
| Parámetro | Tipo | Descripción |
|---|---|---|
| key | Key | ResourceKeys | number | Una clave de mensaje de localización objetivo |
| list | unknown[] | Valores para la interpolación de lista |
| defaultMsg | string | Un mensaje predeterminado que se devuelve si no se encuentra una traducción |
Devuelve
Mensaje traducido
(key: Key | ResourceKeys | number, list: unknown[], options: TranslateOptions<Locales>): string;
Traducción de mensajes de localización para interpolaciones de lista
Firma:
<Key extends string>(key: Key | ResourceKeys | number, list: unknown[], options: TranslateOptions<Locales>): string;Detalles
Sobrecarga de t.
En esta sobrecarga de t, los mensajes de localización deben contener un {0}, {1}, etc., por cada marcador de posición en la lista.
También puedes suprimir la advertencia cuando falta la traducción según las opciones.
Para detalles sobre las opciones, consulta la documentación.
Cómo usar para más información:
Parámetros
| Parámetro | Tipo | Descripción |
|---|---|---|
| key | Key | ResourceKeys | number | Una clave de mensaje de localización objetivo |
| list | unknown[] | Valores para la interpolación de lista |
| options | TranslateOptions<Locales> | Opciones adicionales para la traducción |
Devuelve
Mensaje traducido
MissingHandler
Firma:
export type MissingHandler = (locale: Locale, key: Path, instance?: ComponentInternalInstance | GenericComponentInstance, type?: string) => string | void;useI18n
Usa la API de Composición para Vue I18n
Firma:
export declare function useI18n<Schema = DefaultLocaleMessageSchema, Locales = 'en-US', Options extends UseI18nOptions<SchemaParams<Schema, VueMessageType>, LocaleParams<Locales>> = UseI18nOptions<SchemaParams<Schema, VueMessageType>, LocaleParams<Locales>>>(options?: Options): Composer<NonNullable<Options['messages']>, NonNullable<Options['datetimeFormats']>, NonNullable<Options['numberFormats']>, NonNullable<Options['locale']>>;Parámetros de tipo
| Parámetro | Descripción |
|---|---|
| Schema | El esquema de recursos i18n (mensajes, formatos de fecha, formatos numéricos), por defecto |
| Locales | Los esquemas de localización de recursos i18n, por defecto en-US |
Detalles
Esta función se utiliza principalmente en setup.
Si se especifican opciones, se crea una instancia de Composer por componente, y puedes realizar la localización en ese componente.
Si no se especifican opciones, puedes realizar la localización usando el Composer global.
Parámetros
| Parámetro | Tipo | Descripción |
|---|---|---|
| options | Options | Opciones, ver UseI18nOptions |
Devuelve
Instancia de Composer
Ejemplos
Caso: Localización basada en recursos del componente
<template>
<form>
<label>{{ t('language') }}</label>
<select v-model="locale">
<option value="en">en</option>
<option value="ja">ja</option>
</select>
</form>
<p>message: {{ t('hello') }}</p>
</template>
<script>
import { useI18n } from 'vue-i18n'
export default {
setup() {
const { t, locale } = useI18n({
locale: 'ja',
messages: {
en: { ... },
ja: { ... }
}
})
// Algo que hacer...
return { ..., t, locale }
}
}
</script>UseI18nOptions
Opciones de i18n para useI18n
Firma:
export type UseI18nOptions<Schema extends {
message?: unknown;
datetime?: unknown;
number?: unknown;
} = {
message: DefaultLocaleMessageSchema;
datetime: DefaultDateTimeFormatSchema;
number: DefaultNumberFormatSchema;
}, Locales extends {
messages: unknown;
datetimeFormats: unknown;
numberFormats: unknown;
} | string = Locale, Options extends ComposerOptions<Schema, Locales> = ComposerOptions<Schema, Locales>> = ComposerAdditionalOptions & Options;Detalles
UseI18nOptions hereda de ComposerAdditionalOptions y ComposerOptions, por lo tanto puedes especificar estas opciones.
VueMessageType
Firma:
export type VueMessageType = string | ResourceNode | VNode;