Інтернаціоналізація

Докладніше дивіться в посібнику з інтернаціоналізації.

Швидкий приклад

Змінюйте мову редактора під час виконання:

<script setup lang="ts">
import { useI18n } from 'vue-i18n'

const { locale } = useI18n()

const languages = [
  { code: 'en', name: 'English' },
  { code: 'de', name: 'Deutsch' },
  { code: 'fr', name: 'Français' },
  { code: 'es', name: 'Español' },
]
</script>

<template>
  <div>
    <v-select
      v-model="locale"
      :items="languages"
      item-title="name"
      item-value="code"
      label="Language"
    />

    <Tiptapify />
  </div>
</template>

Доступні локалі

Код	Мова	Код	Мова
en	англійська	ko	корейська
ar	арабська	la	латиська
bg	болгарська	lt	литовська
ch	китайська	nl	нідерландська
cz	чеська	no	норвезька
de	німецька	pl	польська
el	грецька	pt	португальська
es	іспанська	pt-BR	португальська (бразильська)
et	естонська	ro	румунська
fi	фінська	ru	російська
fr	французька	se	шведська
he	іврит	sk	словацька
hi	гінді	sl	словенська
hr	хорватська	sr	сербська
hu	угорська	th	тайська
id	індонезійська	tr	турецька
it	італійська	uk	українська
ja	японська	vi	в'єтнамська

Кілька редакторів з різними локалями

Використовуйте scoped-локалі vue-i18n, щоб задати мову для кожного екземпляра:

<script setup lang="ts">
import { useI18n } from 'vue-i18n'

const en = useI18n({ useScope: 'local', locale: 'en' })
const de = useI18n({ useScope: 'local', locale: 'de' })
</script>

<template>
  <v-row>
    <v-col>
      <h3>English</h3>
      <Tiptapify />
    </v-col>
    <v-col>
      <h3>German</h3>
      <Tiptapify />
    </v-col>
  </v-row>
</template>