TacoTranslate
/
Баримт бичигҮнэ ханш
 
  1. Танилцуулга
  2. Эхлэх
  3. Тохиргоо ба зохицуулалт
  4. TacoTranslate ашиглах
  5. Сервер талын рендеринг
  6. Дэвшилтэт хэрэглээ
  7. Шилдэг туршлагууд
  8. Алдааг удирдах ба алдааг олж засварлах
  9. Дэмжигдсэн хэлүүд

Дэвшилтэт хэрэглээ

Баруун-солгой чиглэлтэй хэлүүдийг удирдах

TacoTranslate нь таны React програмууд дахь Араб, Еврей зэрэг баруунаас зүүн тийш (RTL) хэлүүдийг дэмжихийг хялбар болгодог. RTL хэлүүдийг зөв зохистой боловсруулах нь баруунаас зүүн тийш уншдаг хэрэглэгчдэд таны агуулгыг зөв харуулахыг баталгаажуулдаг.

import {useTacoTranslate} from 'tacotranslate/react';

function Document() {
	const {locale, isRightToLeft} = useTacoTranslate();

	return (
		<html lang={locale} dir={isRightToLeft ? 'rtl' : 'ltr'}>
			<body>
				// ...
			</body>
		</html>
	);
}

Та мөн одоогийн хэлээр React гадаадын тохиргоог шалгахын тулд олгосон isRightToLeftLocaleCode функцийг ашиглаж болно.

import {isRightToLeftLocaleCode} from 'tacotranslate';

function foo(locale = 'es') {
	const direction = isRightToLeftLocaleCode(locale) ? 'rtl' : 'ltr';
	// ...
}

Орчуулгыг идэвхгүй болгох

Мөрийн тодорхой хэсгүүдийн орчуулгыг унтраах эсвэл зарим хэсгүүдийг өөрчлөхгүй хадгалахыг хүсвэл, гурав дахин квадрат тээглүүр triple square brackets ашиглаж болно. Энэ боломж нь нэр, техникийн нэр томъёо болон бусад орчуулахгүй байх ёстой агуулгыг анхны хэлбэрээр нь хадгалахад ашиглагддаг.

import {Translate} from 'tacotranslate/react';

function Component() {
	return (
		<Translate string="Hello, [[[TacoTranslate]]]!" />
	);
}

Энэ жишээнд, “TacoTranslate” гэдэг үг орчуулгад өөрчлөгдөхгүй хэвээр байна.

Олон TacoTranslate үйлчилгээ үзүүлэгчид

Бид таны аппликэйшнд олон TacoTranslate үйлчилгээ үзүүлэгчийг ашиглахыг хатуу зөвлөж байна. Энэ нь таны орчуулгууд болон мөрүүдийг толгойн хэсэг, доод хэсэг эсвэл тодорхой хэсгүүд гэх мэт өөр өөр гарал үүсэлд ангилахад өгөөжтэй юм.

Та энд гарал үүсэл ашиглах талаар илүү ихийг уншиж болно.

TacoTranslate хангагчид эцэг хангагчийн тохиргоог өвлөдөг тул бусад тохиргоог дахин дахин оруулах шаардлагагүй болно.

import createTacoTranslateClient from 'tacotranslate';
import {TacoTranslate} from 'tacotranslate/react';

const tacoTranslateClient = createTacoTranslateClient({apiKey: 'YOUR_API_KEY'});

function Header() {
	return (
		<TacoTranslate origin="header">
			// ...
		</TacoTranslate>
	);
}

function Menu() {
	return (
		<TacoTranslate origin="menu">
			// ...
		</TacoTranslate>
	);
}

export default function App() {
	return (
		<TacoTranslate client={tacoTranslateClient} origin="page" locale="es">
			<Header />
			<Menu />
		</TacoTranslate>
	);
}

Эх сурвалж эсвэл орон нутгийн тохиргоог давхардлах

Олон TacoTranslate провайдер ашиглахын зэрэгцээ та Translate бүрэлдэхүүн хэсэг болон useTranslation hook-ийн түвшинд эх сурвалж болон орон нутгийг тохируулан давхар өөрчлөх боломжтой.

import {Translate, useTranslation} from 'tacotranslate/react';

function Greeting() {
	const spanishHello = useTranslation('Hello!', {locale: 'es'});

	return (
		<>
			{spanishHello}
			<Translate string="What’s up?" origin="greeting" />
		</>
	);
}

Ачааллыг удирдах

Клиент талд хэл солихдоо, хэрэглэгчийн холболтонд тулгуурлан орчуулгыг татаж авах нь заримдаа хэдэн агшинг шаардаж болно. Хэл солигдож байх үед хэрэглэгчийн туршлагыг сайжруулахын тулд ачааллын заагчийг харуулах боломжтой.

import {useTacoTranslate} from 'tacotranslate/react';

function Component() {
	const {isLoading} = useTacoTranslate();

	return (
		isLoading ? 'Translations are loading...' : null
	);
}

Олон тооны илэрхийлэл

Олон тоог зөв зохистой боловсруулж, тоог үндэслэсэн шошгыг өөр өөр хэлнүүдэд зөв харуулахын тулд энэ нь хамгийн сайн дадал гэж тооцогдоно:

import {Translate, useLocale} from 'tacotranslate/react';

function PhotoCount() {
	const locale = useLocale();
	const count = 1;

	return count === 0 ? (
		<Translate string="You have no photos." />
	) : count === 1 ? (
		<Translate string="You have 1 photo." />
	) : (
		<Translate
			string="You have {{count}} photos."
			variables={{count: count.toLocaleString(locale)}}
		/>
	);
}

Олон хэл

Нэг програм дотор хэд хэдэн хэл зэрэг дэмжихийн тулд та олон TacoTranslate хангагчийг ашиглаж болно, янз бүрийн locale утгуудыг доорх байдлаар тохируулан:

Та мөн localeкомпонент эсвэл hook түвшинд давж бичиж болно.

import createTacoTranslateClient from 'tacotranslate';
import {TacoTranslate, Translate} from 'tacotranslate/react';

const tacoTranslateClient = createTacoTranslateClient({apiKey: 'YOUR_API_KEY'});

function Spanish() {
	return (
		<TacoTranslate locale="es">
			<Translate string="Hello, world in Spanish!" />
		</TacoTranslate>
	);
}

function Norwegian() {
	return (
		<TacoTranslate locale="no">
			<Translate string="Hello, world in Norwegian!" />
		</TacoTranslate>
	);
}

export default function App() {
	return (
		<TacoTranslate client={tacoTranslateClient} origin="page" locale="es">
			<Spanish />
			<Norwegian />
		</TacoTranslate>
	);
}

Орчуулгын ID ашиглах

Та нэгэн ижил утгатай мөрийн өөр өөр орчуулга эсвэл тайлбарлах утгыг боловсруулахын тулд Translate бүрэлдэхүүн хэсэгт id нэмэж болно. Энэ нь нэгэн ижил текст контекстээс хамааран өөр өөр орчуулга шаарддаг үед онцгой хэрэгтэй. Давтагдашгүй ID-г оноосон тохиолдолд тухайн мөрийн бүрэлдэхүүн бүрийг нарийвчилсан утгын дагуу зөв орчуулж байгаа эсэхийг баталгаажуулдаг.

import {Translate} from 'tacotranslate/react';

function Header() {
	return (
		<Translate id="header" string="Login" />
	);
}

function Footer() {
	return (
		<Translate id="footer" string="Login" />
	);
}

Жишээ нь, толгойн хэсгийн нэвтрэх хэсэг нь испани хэл дээр “Iniciar sesión”, харин доод хэсгийн нэвтрэх хэсэг нь “Acceder” гэж орчуулагдаж болно.

Шилдэг туршлагууд

Nattskiftet-аас гаралтай бүтээгдэхүүнНорвегид бүтээгдсэн