VueCraft NPM

Загрузка namespace ​

useNamespace(ns) лениво загружает один или несколько namespace для текущей активной локали и перезагружает их при каждой смене локали. Работает в паре с разделением локалей по namespace — ключи namespace становятся доступны в t()/tm(), как только возвращаемый ref isLoaded становится true.

ts
import { useNamespace } from 'vue-i18n-kit'

// Загрузить один namespace
const { isLoading, isLoaded } = useNamespace('auth')

// Загрузить несколько namespace сразу
const { isLoading, isLoaded } = useNamespace(['auth', 'forms'])

Аргументы ​

  • ns — string | string[]. Один или несколько namespace, соответствующих файлам <dir>/<локаль>/<namespace>.json, генерируемым vueI18nNamespacePlugin.

Возвращаемое значение ​

isLoading ​

Ref<boolean> — true, пока namespace загружаются.

isLoaded ​

Ref<boolean> — true, как только namespace успешно загружены для текущей локали.

Поддержка SSR ​

useNamespace вызывает onServerPrefetch внутри себя, поэтому namespace, запрошенные во время setup() компонента, дожидаются загрузки до отправки ответа сервера — дополнительная настройка в SSR-приложениях не нужна.

Использование в route guard (вне setup()) ​

Composables работают только внутри setup() компонента. Чтобы лениво загрузить namespace до рендера маршрута, вызовите соответствующий метод сервиса напрямую:

ts
router.beforeEach(async (to) => {
  const ns = to.meta.namespaces as string[] | undefined
  if (ns) await Promise.all(ns.map((n) => i18nPlugin.service.loadNamespace(n)))
})

I18nService предоставляет два метода для работы с namespace наряду с уже описанными на странице Сервис плагина:

  • loadNamespace(ns: string) => Promise<void> — загружает один namespace для активной локали.
  • isNamespaceLoaded(ns: string) => boolean — проверяет, загружен ли уже namespace, не запуская загрузку.