სύνθεებული გამოყენება
მარჯნიდან მარცხნივ წაკითხვადი ენების მხარდაჭერა
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';
// ...
}
თარგმანის გამორთვა
ტექსტის συγκεκριებული ნაწილების თარგმანის გამორთვისთვის ან გარკვეული მონაკვეთების უცვლელად შენარჩუნებისთვის, შეგიძლიათ გამოიყენოთ სამმაგი კვადრატი ფრჩხილები triple square brackets. ეს ფუნქცია სასარგებლოა სახელების, ტექნიკური ტერმინების ან სხვა ნებისმიერი შეიცნობის პირვანდელი ფორმატის შენარჩუნებისთვის, რომელიც არ უნდა თარგმნებოდეს.
import {Translate} from 'tacotranslate/react';
function Component() {
return (
<Translate string="Hello, [[[TacoTranslate]]]!" />
);
}
ამ მაგალითში, სიტყვა “TacoTranslate” დარჩება უცვლელად თარგმანში.
მრავალი TacoTranslate მიმწოდებელი
ჩვენ მკაცრად მოვუწოდებთ თქვენი აპლიკაციაში ერთზე მეტი TacoTranslate
პროვაიდერის გამოყენებას. ეს უზრუნველყოფს თქვენს თარგმანების და სტრიქონების ორგანიზებას სხვადასხვა ორიგინებში, როგორიცაა თქვენი ჰედერი, ფუტერი ან სპეციფიკური სექციები.
შეგიძლიათ გაიგოთ მეტიorigineების გამოყენების შესახებ აქ.
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
);
}
ბროლარიზაცია
მრავლობითობის მართვისა და რაოდენობაზე დაფუძნებული ლეიბლების სწორად ჩვენების მიზნით სხვადასხვა ენებზე, ეს მოითვლება საუკეთესო პრაქტიკად:
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-ების გამოყენებით
თქვენ შეგიძლიათ დაამატოთ 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” ესპანურად.