Баримт бичиг: Дэвшилтэт ашиглалт

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

Mongolian

Зүүнээс баруун тийш бичигддэг хэлний удирдлага

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)}}
		/>
	);
}

Олон хэл

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

Мөн та 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” гэж орчуулагдаж болно.

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