Internationalisation

Consultez le guide d'internationalisation pour tous les détails.

Exemple rapide

Changez la langue de l'éditeur à l'exécution :

<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>

Langues disponibles

Code	Langue	Code	Langue
en	Anglais	ko	Coréen
ar	Arabe	la	Letton
bg	Bulgare	lt	Lituanien
ch	Chinois	nl	Néerlandais
cz	Tchèque	no	Norvégien
de	Allemand	pl	Polonais
el	Grec	pt	Portugais
es	Espagnol	pt-BR	Portugais (brésilien)
et	Estonien	ro	Roumain
fi	Finnois	ru	Russe
fr	Français	se	Suédois
he	Hébreu	sk	Slovaque
hi	Hindi	sl	Slovène
hr	Croate	sr	Serbe
hu	Hongrois	th	Thaï
id	Indonésien	tr	Turc
it	Italien	uk	Ukrainien
ja	Japonais	vi	Vietnamien

Plusieurs éditeurs avec des langues différentes

Utilisez les locales à portée de vue-i18n pour définir une langue par instance :

<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>