Փաստաթղթավորում: Առաջադեմ օգտագործում

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

Armenian

Աջից դեպի ձախ լեզուների կառավարում

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';
	// ...
}

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

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

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” իսպաներեն։

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