Dokumentatsiya: Ilg'or foydalanish

Ilg'or foydalanish

Uzbek

Oʻngdan chapga yoziladigan tillarni boshqarish

TacoTranslate React ilovalaringizda arab va ibrolyniy (Hebrew) kabi o‘ngdan chapga (RTL) o‘qiladigan tillarni qo‘llab-quvvatlashni osonlashtiradi. RTL tillarini to‘g‘ri boshqarish mazmuningiz 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 Reactdan tashqarida joriy tilni tekshirish uchun foydalanishingiz mumkin.

import {isRightToLeftLocaleCode} from 'tacotranslate';

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

Tarjimalarni o'chirish

Matnning ma'lum qismlarini tarjima qilinishini o'chirish yoki ayrim bo'laklarni o'z holida saqlashni ta'minlash uchun uchta to'rtburchak qavsdan foydalanishingiz mumkin. Bu funksiya ism, texnik atamalar yoki boshqa tarjima qilinmasligi kerak bo'lgan mazmundagi elementlarning asl formatini saqlash uchun foydalidir.

import {Translate} from 'tacotranslate/react';

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

Bu misolda, “TacoTranslate” so'zi tarjimada o'zgarmagan holda qoladi.

Bir nechta TacoTranslate provayderlari

Ilovangizda bir nechta TacoTranslate provayderlaridan foydalanishni qat'iyan tavsiya etamiz. Bu tarjimalaringizni va matnlaringizni sarlavha, pastki qism yoki ma'lum bo'limlar kabi turli manbalarga ajratish uchun foydalidir.

Siz manbalarni qanday ishlatish haqida batafsil ma'lumotni bu yerdan o'qishingiz mumkin.

TacoTranslate provayderlari har qanday ota-provayderdan sozlamalarni meros qilib oladi, shuning uchun boshqa sozlamalarni takrorlashga hojat 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>
	);
}

Manba yoki lokalni qayta belgilash

Bir nechta TacoTranslate provayderlaridan foydalanishga qo'shimcha ravishda, siz Translate komponenti va useTranslation hook darajalarida origin va locale sozlamalarini ham o'zgartirishingiz 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 tilni o'zgartirganda, tarjimalarni olish foydalanuvchining internet ulanishiga qarab bir oz vaqt talab qilishi mumkin. O'zgartirish jarayonida foydalanuvchiga holat haqida vizual ma'lumot berish uchun yuklanish indikatorini ko'rsatishingiz mumkin.

import {useTacoTranslate} from 'tacotranslate/react';

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

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

Ko‘plik

Ko‘plikni boshqarish va son asosidagi yorliqlarni turli tillarda to‘g‘ri ko‘rsatish 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 ilovada bir vaqtning o'zida bir nechta tillarni qo'llab-quvvatlash uchun, siz quyida ko'rsatilganidek turli locale qiymatlari bilan bir nechta TacoTranslate provayderlaridan foydalanishingiz mumkin:

Siz shuningdek locale ni komponent yoki hook darajasida qayta belgilashingiz 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 id ni Translate komponentiga qo'shib, bir xil satr uchun turli tarjimalar yoki ma'nolarni boshqarishingiz mumkin. Bu ayniqsa bir xil matn kontekstga qarab turlicha tarjima talab qilganda foydali bo'ladi. Unikal IDlar tayinlash orqali har bir matn nusxasi o'zining aniq ma'nosiga muvofiq ravishda to'g'ri 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 kirish ispan tilida “Iniciar sesión” ga, pastki qismdagi kirish esa “Acceder” ga tarjima qilinishi mumkin.

Eng yaxshi amaliyotlar