extendLocale

既存のロケールをカスタム翻訳で拡張するユーティリティ。

使用法

自動インポートされたextendLocaleユーティリティを使用して、特定のプロパティまたはメッセージをオーバーライドして既存のロケールをカスタマイズします。

<script setup lang="ts">
import { en } from '@nuxt/ui/locale'

const locale = extendLocale(en, {
  code: 'en-AU',
  messages: {
    commandPalette: {
      placeholder: 'Search a component...'
    }
  }
})
</script>

<template>
  <UApp :locale="locale">
    <NuxtPage />
  </UApp>
</template>

これは以下のような場合に便利です。

言語の地域バリアントを作成します例enからen-AU
ロケール全体を再定義せずに特定の翻訳を上書きする
アプリケーションのコンポーネントラベルをカスタマイズする

国際化の詳細については、** i18n integration **のドキュメントを参照してください。

API

extendLocale<M>(locale: Locale<M>, options: Partial<DefineLocaleOptions<DeepPartial<M>>>): Locale<M>

既存のロケールをオプションで拡張し、メッセージを深くマージします。

パラメータ

locale

Locale<M> required

拡張するベースロケール。@nuxt/ui/localeからインポートします。

options

Partial<DefineLocaleOptions<DeepPartial<M>>> required

オーバーライドするプロパティ

戻り値マージされたプロパティを持つ新しいLocale<M>オブジェクト。

例

以下は、オーストラリアのバリアントの英語ロケールを拡張した例です：

<script setup lang="ts">
import { en } from '@nuxt/ui/locale'

const locale = extendLocale(en, {
  name: 'English (Australia)',
  code: 'en-AU',
  messages: {
    colorMode: {
      dark: 'Dark',
      light: 'Light',
      system: 'System'
    },
    selectMenu: {
      search: 'Search…',
      noData: 'No results found',
      noMatch: 'No matching results'
    }
  }
})
</script>

<template>
  <UApp :locale="locale">
    <NuxtPage />
  </UApp>
</template>

extendLocaleユーティリティはディープマージを使用しているので、オーバーライドしたいメッセージを指定するだけで済みます。その他のメッセージはすべてベースロケールから継承されます。

defineShortcuts

A composable to define keyboard shortcuts in your app.

extractShortcuts

A utility to extract keyboard shortcuts from menu items.