Dokümantasyon

<T> bileşeni

İçeriğinizi çevirmek için <T> bileşenine sarın. Orijinal içerik, çeviri yüklenene kadar gösterilir.

<T>This content will be translated</T>

Bağlamalı metin de işe yarıyor. İçerik değiştiğinde, örneğin name değiştiğinde tekrar çevrilir:

<T>Hello {{ name }}</T>

İsimler ve sayılar gibi sık değişen değerler için bunun yerine değişkenler kullanın, böylece metin yalnızca bir kez çevrilir.

Aynı anda talep edilen tüm çeviriler tek bir istekte API'ye gönderilir ve çeviriler önbelleğe alınır. İstediğiniz kadar <T> bileşeni kullanabilirsiniz.

Eklenti <T> 'i global olarak kaydeder. Ayrıca içe aktarabilirsiniz: import { T } from '@magic-translate/vue'. Translate, T ile aynı bileşendir.

Props

PropTürAçıklama
formality'informal' | 'formal'Çevirinin formalitesini ayarlar.
idstringMetnin bu kullanımını kendi başına düzenlemenizi sağlar.
langLanguagecreateMagicTranslate ile ayarlanan dili geçersiz kılar.
vRecord<string, unknown>Çevrilmeyen değerler, içerikte $name olarak atıfta bulunulur. Değiş kenlere bakın.
<T lang="fr" formality="formal">How are you?</T>

Değişkenler

v 'de ad veya sayım gibi değişen değerleri iletin ve içerikte $name olarak referans verin:

<T :v="{ name: user.name, count }">Hi $name, you have $count new messages</T>

Magic Translate, değerlerin etrafındaki metni bir kez Hi {0}, you have {1} new messages olarak çevirir ve değerleri uygulamanıza geri koyar. Çeviri önbelleğe alınır ve her isim ve her sayı için çalışır ve değerlerin kendileri asla Magic Translate 'a gönderilmez. Yalnızca değerler değiştiğinde, yeni bir istek yapılmaz.

Değerler ilk göründükleri sıraya göre numaralandırılır. Çeviri, onları dilin ihtiyaç duyduğu yere taşıyabilir, örneğin {1} neue Nachrichten für {0}. Değerlerin etrafındaki metin HTML içerebilir:

<T :v="{ count: cart.items.length }">You have <b>$count items</b> in your cart.</T>

Birkaç kural:

  • Yalnızca v tuşları değiştirilir, bu nedenle $5 gibi metinler olduğu gibi kalır. count ve counts gibi iki tuş aynı şekilde başlarsa, en uzun anahtar kazanır.
  • Aynı isim birden fazla kez görünebilir.
  • Değerler metin olarak eklenir, HTML olarak asla eklenmez. Bunun yerine etraflarındaki metne işaretleme koyun: Hi <b>$name</b>.
  • Değişkenler href veya title gibi özniteliklerde değil, yalnızca metinde değiştirilir.
  • Metinde görünmeyen bir anahtar, yazım hatalarını yakalayan bir uyarı kaydeder.
  • Sunucu tarafı oluşturmada, örneğin Nuxt ile, v içeren bir <T> sunucuda boş renderlenir ve uygulama tarayıcıda çalıştırıldığında görünür.

Sınırlamalar

  1. Vue bileşenlerini <T> bileşeninin içine yerleştiremezsiniz. Düz HTML öğeleri iyidir (aşağıdaki örneğe bakın) ve kapsamlı stiller bunlar üzerinde çalışmaya devam eder.
  2. <T> bileşeninin içindeki içerik, yaklaşık 5.000 karakter olan 10 KB'yi geçemez.
<!-- this is OK, since <a> is a plain HTML element -->
<T>
  <a href="mailto:info@i42.ch">Please send us an email</a>
</T>


<!-- this does NOT work, since <MyButton> is a Vue component -->
<T>
  <MyButton>Click me</MyButton>
</T>

Öznitelikleri ve diğer dizeleri çevirmek için useTranslate composable işaretini kullanın.

ÖncekiVueSonrakiuseTranslate composable