Փաստաթղթավորում: Ընդլայնված օգտագործում

Ընդլայնված օգտագործում

Armenian

Աջից ձախ ուղղությամբ գրվող լեզուների աջակցություն

TacoTranslate-ը հեշտացնում է աջից ձախ (RTL) ուղղությամբ կարդացվող լեզուների, ինչպիսիք են արաբերենը և եբրայերենը, աջակցումը ձեր React հավելվածներում։ 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';
	// ...
}

Թարգմանության անջատում

Տողերի որոշ մասերի թարգմանությունը անջատելու կամ որոշ հատվածներ ինչպես կա պահպանելու కోసం կարող եք օգտագործել եռակի քառակուսի փակագծեր։ Այս հատկությունը օգտակար է անունների, տեխնիկական տերմինների կամ այլ ցանկացած բովանդակության սկզբնական ձևաչափը պահպանելու համար, որը չպետք է թարգմանվի։

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-ների օգտագործում

Դուք կարող եք id ավելացնել Translate կոմպոնենտին՝ նույն տեքստի տարբեր թարգմանություններն ու նշանակությունները կառավարելու համար։ Սա հատկապես օգտակար է, երբ նույն տեքստը համատեքստի պատճառով պահանջում է տարբեր թարգմանություններ։ Հատուկ 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” իսպաներենում։

Լավագույն պրակտիկաներ