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

მოწინავე გამოყენება

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 ჰუკის დონეზე.

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" />
	);
}

მაგალითად, ჰედერში არსებული 'login' შეიძლება ითარგმნოს “Iniciar sesión”, ხოლო ფუტერში არსებული 'login' შეიძლება ითარგმნოს “Acceder” ესპანურად.

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