Hujjatlar: Ilg'or foydalanish

Kengaytirilgan foydalanish

Uzbek

Oʻngdan chapga yoziladigan tillar bilan ishlash

TacoTranslate React ilovalaringizda arab va ivrit kabi o'ngdan chapga yoziladigan (RTL) tillarni qo'llab-quvvatlashni osonlashtiradi. RTL tillarini to'g'ri qo'llash kontentingizni o'ngdan chapga o'qiydigan foydalanuvchilar uchun to'g'ri ko'rsatilishini ta'minlaydi.

import {useTacoTranslate} from 'tacotranslate/react';

function Document() {
	const {locale, isRightToLeft} = useTacoTranslate();

	return (
		<html lang={locale} dir={isRightToLeft ? 'rtl' : 'ltr'}>
			<body>
				// ...
			</body>
		</html>
	);
}

Shuningdek, taqdim etilgan isRightToLeftLocaleCode funksiyasidan React tashqarisida joriy tilni tekshirish uchun foydalanishingiz mumkin.

import {isRightToLeftLocaleCode} from 'tacotranslate';

function foo(locale = 'es') {
	const direction = isRightToLeftLocaleCode(locale) ? 'rtl' : 'ltr';
	// ...
}

Tarjimani o'chirish

Matnning ma'lum qismlarini tarjimasini o‘chirish yoki ba'zi bo‘laklarning asl holicha saqlanishini ta'minlash uchun uchta kvadrat qavslardan foydalanishingiz mumkin. Bu xususiyat ism‑familiyalar, texnik atamalar yoki tarjima qilinmasligi kerak bo‘lgan boshqa har qanday mazmunning asl formatini saqlash uchun foydalidir.

import {Translate} from 'tacotranslate/react';

function Component() {
	return (
		<Translate string="Hello, [[[TacoTranslate]]]!" />
	);
}

Ushbu misolda, “TacoTranslate” so'zi tarjimada o'zgarmaydi.

Bir nechta TacoTranslate provayderlari

Biz ilovangizda bir nechta TacoTranslate provayderlaridan foydalanishni qatʼiyan tavsiya qilamiz. Bu tarjimalaringizni va matnlaringizni sarlavha, pastki qism yoki muayyan bo‘limlar kabi turli manbalarga tartiblab joylashtirish uchun foydalidir.

Siz manbalardan foydalanish haqida bu yerdan ko'proq o'qishingiz mumkin.

TacoTranslate provayderlari har qanday ota provayderdan sozlamalarni meros qilib oladi, shuning uchun boshqa sozlamalarni takrorlashning hojati yo'q.

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

Origin yoki locale'ni bekor qilib o'zgartirish

Bir nechta TacoTranslate provayderlaridan foydalanish bilan bir qatorda, siz Translate komponenti va useTranslation hook darajalarida origin va locale parametrlarini ham ustidan yozishingiz mumkin.

import {Translate, useTranslation} from 'tacotranslate/react';

function Greeting() {
	const spanishHello = useTranslation('Hello!', {locale: 'es'});

	return (
		<>
			{spanishHello}
			<Translate string="What’s up?" origin="greeting" />
		</>
	);
}

Yuklanishni boshqarish

Klient tomonida tillarni o'zgartirganda, tarjimalarni yuklash foydalanuvchining aloqa tezligiga qarab bir necha soniya davom etishi mumkin. O'tish vaqtida foydalanuvchiga vizual fikr-mulohaza berish uchun yuklanish indikatorini ko'rsating.

import {useTacoTranslate} from 'tacotranslate/react';

function Component() {
	const {isLoading} = useTacoTranslate();

	return (
		isLoading ? 'Translations are loading...' : null
	);
}

Ko‘plik

Ko‘plikni boshqarish va turli tillarda sonlarga asoslangan yorliqlarni to‘g‘ri ko‘rsatish uchun, bu eng yaxshi amaliyot hisoblanadi:

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

Bir nechta tillar

Bir xil ilovada bir nechta tillarni bir vaqtning o'zida qo'llab-quvvatlash uchun, siz quyida ko'rsatilganidek turli locale qiymatlari bilan bir nechta TacoTranslate provayderlaridan foydalanishingiz mumkin:

Shuningdek, localeni komponent yoki hook darajasida o'zgartirishingiz mumkin.

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

Tarjima identifikatorlaridan foydalanish

Siz idni Translate komponentiga qo'shishingiz mumkin, bu bir xil matn uchun turli tarjimalar yoki ma'nolarni boshqarish imkonini beradi. Bu ayniqsa bir xil matn kontekstga qarab turlicha tarjima talab qilganda foydalidir. Noyob IDlar tayinlash orqali matnning har bir nusxasi o'ziga xos ma'nosiga muvofiq aniq tarjima qilinishini ta'minlaysiz.

import {Translate} from 'tacotranslate/react';

function Header() {
	return (
		<Translate id="header" string="Login" />
	);
}

function Footer() {
	return (
		<Translate id="footer" string="Login" />
	);
}

Masalan, sarlavhadagi login ispan tilida “Iniciar sesión”, va pastki qismdagi login esa “Acceder” deb tarjima qilinishi mumkin.

Eng yaxshi amaliyotlar