TacoTranslate
/
დოკუმენტაციაფასები
 
  1. შესავალი
  2. დაწყება
  3. დაყენება და კონფიგურაცია
  4. TacoTranslate-ის გამოყენება
  5. სერვერზე რენდერირება
  6. დახვეწილი გამოყენება
  7. საუკეთესო პრაქტიკები
  8. შეცდომების მართვა და დებაგირება
  9. მხარდაჭერილი ენები

დახვეწილი გამოყენება

მარჯვნიდან მარცხნივ (RTL) ენების მხარდაჭერა

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 პროვაიდერის გამოყენების გარდა, თქვენ ასევე შეგიძლიათ ორივე origin და locale გადაწეროთ 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" />
	);
}

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

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

პროდუქტი Nattskiftet-დანდამზადებულია ნორვეგიაში