Առաջադեմ օգտագործում
Ձախից աջ լեզուների հետ աշխատելը
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
հուկի մակարդակներում։
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
);
}
Բազմivanje
Բազմության ձևերի ճիշտ մշակման և հաշիվագրված պիտակների ճիշտ ցուցադրման համար տարբեր լեզուներում, սա համարվում է լավագույն պրակտիկա։
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" />
);
}
Օրինակ, header login-ը կարող է թարգմանվել որպես “Iniciar sesión”, իսկ footer login-ը՝ որպես “Acceder” իսպաներեն: