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

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

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

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

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 хуулбарын түвшинд эх үүсвэр болон орон нутгийн тохиргоог давуу тал болгож өөрчилж болно.

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

Олон тоо

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

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-ыг компонент эсвэл хукын түвшинд давуулах боломжтой.

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

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

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