Hujjatlar: Kengaytirilgan foydalanish

Kengaytirilgan foydalanish

Uzbek

Oʻngdan chapga tillarni boshqarish

TacoTranslate sizning React ilovalaringizda arabcha va ivrit kabi o‘ngdan chapga (RTL) tillarni qo‘llab-quvvatlashni osonlashtiradi. RTL tillarini to‘g‘ri boshqarish, o‘ngdan chapga o‘qiydigan foydalanuvchilar uchun kontentingizning 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>
	);
}

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

import {isRightToLeftLocaleCode} from 'tacotranslate';

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

Tarjimani oʻchirib qoʻyish

Matnning ma'lum qismlarini tarjimasini o‘chirish yoki ba'zi segmentlarni o‘zgarmas holatda saqlash uchun uchta to‘rtburchak qavslar triple square brackets dan foydalanishingiz mumkin. Bu funksiya ism, texnik atamalar yoki tarjima qilinmasligi kerak bo‘lgan boshqa har qanday mazmunning asl formatini saqlashda foydalidir.

import {Translate} from 'tacotranslate/react';

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

Ushbu misolda “TacoTranslate” soʻzi tarjimada oʻzgarmagan holda qoladi.

Bir nechta TacoTranslate provayderlari

Biz ilovangizda bir nechta TacoTranslate provayderlaridan foydalanishni kuchli tavsiya qilamiz. Bu tarjimalaringiz va matnlaringizni boshqarish uchun, masalan, sarlavha, pastki qism yoki maʼlum boʻlimlar kabi turli manbalarga ajratishda foydalidir.

Siz manbalardan foydalanish haqida bu yerda ko‘proq o‘qishingiz mumkin.

TacoTranslate provayderlari har qanday ota-provayderning sozlamalarini meros qilib oladi, shuning uchun boshqa sozlamalarni takrorlash shart emas.

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

Kelib chiqish yoki mintaqani ustun qo‘yish

Bir nechta TacoTranslate provayderlaridan foydalanishga qo'shimcha ravishda, siz Translate komponenti va useTranslation hook darajalarida ham origin ham locale ni bekor qilishingiz 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

Mijoz tomonida tillarni o‘zgartirishda, tarjimalarni olish foydalanuvchining ulanishiga qarab bir necha soniya vaqt olishi mumkin. O‘zgartirish jarayonida vizual javob qaytarish orqali foydalanuvchi tajribasini yaxshilash uchun yuklanish indikatorini ko‘rsatishingiz mumkin.

import {useTacoTranslate} from 'tacotranslate/react';

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

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

Ko‘plik shakllari

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

Siz shuningdek localeni komponent yoki hook darajasida bekor qilishingiz 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 Translate komponentiga bir xil satr uchun turli tarjimalar yoki ma'nolarni boshqarish uchun id qo‘shishingiz mumkin. Bu ayniqsa, bir xil matn kontekstga qarab turli tarjimalarni talab qilganda foydalidir. Noyob IDlarni belgilash orqali siz har bir satr nusxasining 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, header login ispanchada “Iniciar sesión”, footer login esa “Acceder” deb tarjima qilinishi mumkin.

Eng yaxshi amaliyotlar