Internationalisation (i18n)

• Langues disponibles
• Utilisation d'un paramètre régional
• Changer le paramètre régional actif
  • Utilisation de setLocale
  • Utilisation de config racine
• Remplacement
• Ajouter votre langue

FormKit est livré avec une prise en charge de l'internationalisation pour toutes ses interfaces et messages de validation.

Langues disponibles

Actuellement, FormKit prend en charge les langues suivantes (dans le package @formkit/i18n) :

• 🇱🇾 Arabe (ar) — 🙏 @Ahmedelforjani
• 🇦🇿 Azéri (az) — 🙏 @EmrullahKutlar
• 🇧🇬 Bulgare (bg) — 🙏 @ivanov1234159
• Catalan (ca) — 🙏 @petergithubmgw
• 🇨🇳 Chinois (zh) — 🙏 @myleslee
• 🇨🇳 Chinois traditionnel (zh-TW) — 🙏 @actocoa
• 🇭🇷 Croate (hr) — 🙏 @antemarkic
• 🇨🇿 Tchèque (cs) — 🙏 @dfridrich
• 🇩🇰 Danois (da) — 🙏 @bjerggaard
• 🇳🇱 Néerlandais (nl) — 🙏 @arjendejong12
• 🇺🇸 Anglais (en)
• 🇫🇮 Finnois - (fi) — 🙏 @mihqusta
• 🇫🇷 Français (fr) — 🙏 @HoreKk, @pop123123123
• Frison (fy) — 🙏 @arjendejong12
• 🇩🇪 Allemand (de) — 🙏 @digitalkaoz, @tosling
• 🇬🇷 Grec (el) — 🙏 @mendrinos
• 🇮🇱 Hébreu (he) - 🙏 @Hepi420
• 🇭🇺 Hongrois (hu) — 🙏 @KristofKekesi
• 🇮🇸 Islandais (is) - 🙏 @Gunsobal
• 🇮🇩 Indonésien (id) - 🙏 @rama-adi
• 🇮🇹 Italien (it) - 🙏 @punga78, @Archetipo95
• 🇯🇵 Japonais (ja) - 🙏 @wonyx
• 🇰🇿 Kazakh (kk) - 🙏 @ilya-raevskiy
• 🇰🇷 Coréen (ko) - 🙏 @bwp618, @titusdecali
• 🇱🇻 Letton (lv) - 🙏 @Bamslation
• 🇲🇳 Mongol (mn) - 🙏 @zemunkh
• 🇳🇴 Norvégien Bokmål (nb) - 🙏 @hognevevle
• 🇮🇷 Persan (fa) - 🙏 @shahabbasian
• 🇵🇱 Polonais (pl) - 🙏 @xxSkyy
• 🇧🇷 Portugais (pt) 🙏 @r-martins, @dbomfim
• 🇷🇴 Roumain (ro) - 🙏 @danve
• 🇷🇺 Russe (ru) - 🙏 @andreimakushkin
• 🇸🇰 Slovaque (sk) - 🙏 @neridev
• 🇸🇮 Slovène (sl) - 🙏 @krisflajs
• 🇷🇸 Serbe (sr) - 🙏 @milos5593
• 🇦🇷 Espagnol (es) - 🙏 @inibg
• 🇸🇪 Suédois (sv) - 🙏 @purung
• 🇹🇯 Tadjik (tg) - 🙏 @devixrootix
• 🇹🇱 Tetum (tet) - 🙏 @joshbrooks
• 🇹🇭 Thaï (th) - 🙏 @pknn
• 🇺🇦 Ukrainien (uk) - 🙏 @aresofficial
• 🇺🇿 Ouzbek (uz) - 🙏 @root5427
• 🇹🇷 Turc (tr) - 🙏 @ragokan, @cemkaan
• 🇻🇳 Vietnamien (vi) - 🙏 @oanhnn

Bien que les drapeaux soient de mauvaises représentations des langues (les drapeaux indiquent une nation géographique, tandis que les langues peuvent être parlées dans de nombreuses régions du monde), nous utilisons les drapeaux dans la liste ci-dessus pour indiquer l'emplacement du contributeur qui a créé cette locale particulière.

Utilisation d'un paramètre régional

Le defaultConfig de FormKit inclut le paramètre régional anglais par défaut — pour ajouter un paramètre régional supplémentaire, importez-le de @formkit/i18n et ajoutez-le à l'option locales lorsque vous initialisez le plugin FormKit. Pour définir le paramètre régional actif, spécifiez-le avec l'option locale :

import { createApp } from 'vue'
import App from 'App.vue'
import { plugin, defaultConfig } from '@formkit/vue'
import { de, fr, zh } from '@formkit/i18n'

const app = createApp(App)
app.use(
  plugin,
  defaultConfig({
    // Définir des paramètres régionaux supplémentaires
    locales: { de, fr, zh },
    // Définir le paramètre régional actif
    locale: 'fr',
  })
)
app.mount('#app')

Changer le paramètre régional actif

Il existe deux façons de changer votre paramètre régional actif :

• En utilisant this.$formkit.setLocale() à partir du plugin Vue (meilleur pour l'API d'options).
• En modifiant directement l'objet config racine (meilleur pour l'API de composition).

Utilisation de setLocale

Lors de l'utilisation de l'API d'options de Vue, vous avez accès à this.$formkit qui contient setLocale('de') — une méthode spécialement conçue qui change globalement le paramètre régional actuel :

Utilisation de config racine

Lors de l'utilisation de l'API de composition, vous n'aurez pas accès à this.$formkit. Au lieu de cela, vous pouvez récupérer et modifier l'objet de configuration racine de FormKit. Ceci est rendu disponible globalement via le mécanisme inject de Vue et un symbole unique :

Remplacement

Si vous trouvez qu'une phrase dans votre paramètre régional n'est pas formulée comme vous le souhaitez, vous pouvez remplacer ces messages individuels globalement dans votre configuration. Vous pouvez le faire en fournissant un objet messages à la defaultConfig :

import { createApp } from 'vue'
import { plugin, defaultConfig } from '@formkit/vue'
import App from 'App.vue'

const app = createApp(App)
app.use(
  plugin,
  defaultConfig({
    messages: {
      en: {
        ui: {
          submit: '🚀 Lancer',
        },
      },
    },
  })
)

Ajouter votre langue

Écrire une localisation pour une langue que vous connaissez est un excellent moyen de contribuer à FormKit et une façon facile de commencer avec l'open source aussi ! Nous sommes toujours impatients de voir des demandes de tirage pour de nouvelles localisations. Pour soutenir cet effort, nous avons créé un constructeur de localisation - une petite application web pour rendre le processus de traduction aussi facile que possible.

Bien sûr, vous n'êtes pas obligé d'utiliser notre constructeur de localisation pour soumettre une langue, et vous êtes plus que bienvenu pour soumettre une demande de tirage standard avec votre localisation incluse.