vue-i18n / general / useI18n

Функция: useI18n()

Переменная Signature

function useI18n<Options>(options?): Composer<NonNullable<Options["messages"]>, NonNullable<Options["datetimeFormats"]>, NonNullable<Options["numberFormats"]>, Options["locale"] extends unknown ? string : Options["locale"]>;

Type Parameters

Параметр типа

Тип по умолчанию

Options extends UseI18nOptions<{ datetime: IntlDateTimeFormat; message: DefaultLocaleMessageSchema; number: IntlNumberFormat; }, string, ComposerOptions<{ datetime: IntlDateTimeFormat; message: DefaultLocaleMessageSchema; number: IntlNumberFormat; }, string, string, string, string, LocaleMessage<VueMessageType>, IntlDateTimeFormat, IntlNumberFormat, LocaleMessages<LocaleMessage<VueMessageType>, string, VueMessageType>, IntlDateTimeFormats<IntlDateTimeFormat, string>, IntlNumberFormats<IntlNumberFormat, string>>>

UseI18nOptions<{ datetime: IntlDateTimeFormat; message: DefaultLocaleMessageSchema; number: IntlNumberFormat; }, string, ComposerOptions<{ datetime: IntlDateTimeFormat; message: DefaultLocaleMessageSchema; number: IntlNumberFormat; }, string, string, string, string, LocaleMessage<VueMessageType>, IntlDateTimeFormat, IntlNumberFormat, LocaleMessages<LocaleMessage<VueMessageType>, string, VueMessageType>, IntlDateTimeFormats<IntlDateTimeFormat, string>, IntlNumberFormats<IntlNumberFormat, string>>>

Parameters

Параметр	Тип
options?	Options

Возвращает

Composer<NonNullable<Options["messages"]>, NonNullable<Options["datetimeFormats"]>, NonNullable<Options["numberFormats"]>, Options["locale"] extends unknown ? string : Options["locale"]>

Переменная Signature

function useI18n<Options>(options?): Composer<NonNullable<Options["messages"]>, NonNullable<Options["datetimeFormats"]>, NonNullable<Options["numberFormats"]>, Options["locale"] extends unknown ? string : Options["locale"]>;

Параметры типа

Type Parameter	Default type	Description
Schema	LocaleMessage<VueMessageType>	The i18n resources (messages, datetimeFormats, numberFormats) schema, default LocaleMessage
Locales	"en-US"	The locales of i18n resource schema, default en-US
Options extends UseI18nOptions<SchemaParams<Schema, VueMessageType>, LocaleParams<Locales>, ComposerOptions<SchemaParams<Schema, VueMessageType>, LocaleParams<Locales>, LocaleParams<Locales> extends object ? M : LocaleParams<Locales> extends string ? string & LocaleParams<Locales> : string, LocaleParams<Locales> extends object ? D : LocaleParams<Locales> extends string ? string & LocaleParams<Locales> : string, LocaleParams<Locales> extends object ? N : LocaleParams<Locales> extends string ? string & LocaleParams<Locales> : string, SchemaParams<Schema, VueMessageType> extends object ? M : LocaleMessage<VueMessageType>, SchemaParams<Schema, VueMessageType> extends object ? D : IntlDateTimeFormat, SchemaParams<Schema, VueMessageType> extends object ? N : IntlNumberFormat, LocaleMessages<SchemaParams<Schema, VueMessageType> extends object ? M : LocaleMessage<VueMessageType>, LocaleParams<Locales> extends object ? M : LocaleParams<Locales> extends string ? string & LocaleParams<Locales> : string, VueMessageType>, IntlDateTimeFormats<SchemaParams<Schema, VueMessageType> extends object ? D : IntlDateTimeFormat, LocaleParams<Locales> extends object ? D : LocaleParams<Locales> extends string ? string & LocaleParams<Locales> : string>, IntlNumberFormats<SchemaParams<Schema, VueMessageType> extends object ? N : IntlNumberFormat, LocaleParams<Locales> extends object ? N : LocaleParams<Locales> extends string ? string & LocaleParams<Locales> : string>>>	UseI18nOptions<SchemaParams<Schema, VueMessageType>, LocaleParams<Locales>, ComposerOptions<SchemaParams<Schema, VueMessageType>, LocaleParams<Locales>, LocaleParams<Locales> extends object ? M : LocaleParams<Locales> extends string ? string & LocaleParams<Locales> : string, LocaleParams<Locales> extends object ? D : LocaleParams<Locales> extends string ? string & LocaleParams<Locales> : string, LocaleParams<Locales> extends object ? N : LocaleParams<Locales> extends string ? string & LocaleParams<Locales> : string, SchemaParams<Schema, VueMessageType> extends object ? M : LocaleMessage<VueMessageType>, SchemaParams<Schema, VueMessageType> extends object ? D : IntlDateTimeFormat, SchemaParams<Schema, VueMessageType> extends object ? N : IntlNumberFormat, LocaleMessages<SchemaParams<Schema, VueMessageType> extends object ? M : LocaleMessage<VueMessageType>, LocaleParams<Locales> extends object ? M : LocaleParams<Locales> extends string ? string & LocaleParams<Locales> : string, VueMessageType>, IntlDateTimeFormats<SchemaParams<Schema, VueMessageType> extends object ? D : IntlDateTimeFormat, LocaleParams<Locales> extends object ? D : LocaleParams<Locales> extends string ? string & LocaleParams<Locales> : string>, IntlNumberFormats<SchemaParams<Schema, VueMessageType> extends object ? N : IntlNumberFormat, LocaleParams<Locales> extends object ? N : LocaleParams<Locales> extends string ? string & LocaleParams<Locales> : string>>>	-

Параметры

Параметр	Тип	Описание
options?	Options	Параметры, см. UseI18nOptions

Возвращает

Composer<NonNullable<Options["messages"]>, NonNullable<Options["datetimeFormats"]>, NonNullable<Options["numberFormats"]>, NonNullable<Options["locale"]>>

Экземпляр Composer

Примечания

Эта функция в основном используется в setup.

Если указаны параметры, экземпляр Composer создается для каждого компонента, и вы можете выполнять локализацию на уровне компонента.

Если параметры не указаны, вы можете выполнять локализацию с использованием глобального Composer.

Пример

случай: локализация на основе ресурсов компонента

<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: { ... }
     }
   })
   // Something to do ...

   return { ..., t, locale }
 }
}
</script>

Композиция Vue I18n