Hujjatlar: Kengaytirilgan foydalanish

Ilgʻor foydalanish

Uzbek

O‘ngdan chapga tillarni boshqarish

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

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‘chirish

Matnning maʼlum qismlarini tarjimadan oʻchirish yoki ayrim segmentlarning oʻzgarishsiz saqlanishini taʼminlash uchun uch qavslarga olingan qavslar triple square bracketsdan foydalanishingiz mumkin. Ushbu funksiya ismlar, texnik atamalar yoki tarjima qilinmasligi lozim boʻlgan boshqa mazmunlarning asl formatini saqlash uchun foydalidir.

import {Translate} from 'tacotranslate/react';

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

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

Bir nechta TacoTranslate provayderlari

Dasturingizda bir nechta TacoTranslate provayderlaridan foydalanishni qat’iyan tavsiya qilamiz. Bu tarjimalaringizni va satrlaringizni boshqarish uchun turli manbalarga, masalan, sarlavha, pastki qism yoki maxsus bo‘limlarga ajratishda foydalidir.

Siz manbalarni qanday ishlatish haqida batafsilroq o'qishingiz mumkin.

TacoTranslate provayderlari har qanday ota provayderdan sozlamalarni meros qilib oladi, shuning uchun boshqa sozlamalarni takrorlashga hojat qolmaydi.

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 bekor qilish

Bir nechta TacoTranslate provayderlaridan foydalanishga qo'shimcha ravishda, siz Translate komponenti va useTranslation hook darajalarida ham manba va tilni 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‘zgartirganda, foydalanuvchining ulanishiga qarab tarjimalarni olish bir necha soniya davom etishi mumkin. O‘tish jarayonida foydalanuvchi tajribasini yaxshilash uchun yuklanish ko‘rsatkichini ko‘rsatishingiz mumkin.

import {useTacoTranslate} from 'tacotranslate/react';

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

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

Ko‘plik shakli berish

Ko‘plikni boshqarish va turli tillarda son-ga asoslangan yorliqlarni to‘g‘ri ko‘rsatish uchun bu eng yaxshi amaliyot sifatida 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 ilova ichida bir nechta tillarni bir vaqtning o'zida qo'llab-quvvatlash uchun, quyida ko'rsatilganidek, turli locale qiymatlar bilan bir nechta TacoTranslate provayderlaridan foydalanishingiz mumkin:

Shuningdek, locale ni 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 ID’laridan foydalanish

Siz Translate komponentiga id qoʻshishingiz mumkin, bu bir xil satr uchun turli tarjimalar yoki ma'nolarni boshqarishga yordam beradi. Bu ayniqsa, bir xil matn kontekstga qarab turli tarjimalarni talab qilganda juda foydalidir. Yagona IDlarni belgilash orqali, satrning har bir nusxasi oʻzining aniq ma'nosiga muvofiq 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, header login “Iniciar sesión” ga, footer login esa ispan tilida “Acceder” ga tarjima qilinishi mumkin.

Eng yaxshi amaliyotlar