მიღწეული გამოყენება
მარჯვენიდან მარცხნივ ენების მართვა
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
კომპონენტის ან ჰუკის დონეზე.
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” ესპანურად.