დოკუმენტაცია: მოწინავე გამოყენება

გაფართოებული გამოყენება

Georgian

მარჯვენიდან მარცხნივ წერის ენების მხარდაჭერა

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” ესპანურად.

საუკეთესო პრაქტიკები