డాక్యుమెంటేషన్: ఉన్నత వినియోగం

అధునాతన వినియోగం

Telugu

కుడి నుంచి ఎడమ దిశగా వ్రాయబడే భాషల నిర్వహణ

TacoTranslate మీ React అనువర్‍జనలలో అరబిక్ మరియు హీబ్రూ వంటి కుడి నుంచి ఎడమ (RTL) భాషలకు మద్దతు ఇవ్వడం సులభం చేస్తుంది. 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';
	// ...
}

అనువాదాన్ని నిలిపివేయడం

స్ట్రింగ్‌లోని నిర్దిష్ట భాగాలకి అనువాదాన్ని నిలిపివేయడానికి లేదా కొన్ని భాగాలు అసలైనట్లుగా ఉంచాలనుకుంటే, మీరు మూడు చదరపు బ్రాకెట్లను (triple square brackets) ఉపయోగించవచ్చు. ఈ ఫీచర్ పేర్లు, సాంకేతిక పదాలు లేదా అనువదించకూడని ఇతర ఏదైనా విషయాల అసలు ఫార్మాట్‌ను నిలుపుకోవడానికి ఉపయోగపడుతుంది.

import {Translate} from 'tacotranslate/react';

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

ఈ ఉదాహరణలో, “TacoTranslate” అనే పదం అనువాదంలో మారకుండా ఉంటుంది.

బహుళ TacoTranslate ప్రొవైడర్లు

మేము మీ యాప్‌లో బహుళ TacoTranslate ప్రొవైడర్లను వినియోగించమని బలంగా సూచిస్తున్నాం. ఇది మీ అనువాదాలు మరియు స్ట్రింగ్‌లను హెడ్డర్, ఫుటర్ లేదా ప్రత్యేక విభాగాల వంటి వేర్వేరు మూలాల్లో వ్యవస్థీకరించడానికి ఉపయోగకరం.

మీరు ఇక్కడ origins వినియోగంపై మరింత సమాచారం చదవండి.

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 ప్రొవైడర్లను ఉపయోగించడం తో పాటు, మీరు Translate కాంపోనెంట్ మరియు useTranslation హుక్ లెవల్స్ పై కూడా origin మరియు locale రెండింటినీ ఓవర్‌రైడ్ చేయవచ్చు.

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

బహుభాషలు

ఒకే అప్లికేషన్‌లో ఒకేసారి బహుభాషలను మద్దతు చేయడానికి, క్రింద చూపినట్లుగా వేర్వేరు locale విలువలతో మీరు బహుళ TacoTranslate ప్రొవైడర్లను ఉపయోగించవచ్చు:

మీరు కూడా 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లను ఉపయోగించడం

ఒకే స్ట్రింగ్‌కి వేర్వేరు అనువాదాలు లేదా అర్థాలు నిర్వహించడానికి, మీరు Translate కంపోనెంట్‌కు idను జోడించవచ్చు. సందర్భం ఆధారంగా ఒకే టెక్స్ట్‌కి వేర్వేరు అనువాదాలు అవసరమైతే ఇది ప్రత్యేకంగా ఉపయోగపడుతుంది. ప్రత్యేక IDలు కేటాయించడం ద్వారా, ఆ స్ట్రింగ్ యొక్క ప్రతి ఉదాహరణను దాని నిర్దిష్ట అర్థం ప్రకారం ఖచ్చితంగా అనువదించబడేలా మీరు నిర్ధారించగలరు.

import {Translate} from 'tacotranslate/react';

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

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

ఉదాహరణకు, హెడర్ లాగిన్ స్పానిష్‌లో “Iniciar sesión” గా, ఫుటర్ లాగిన్ స్పానిష్‌లో “Acceder” గా అనువదించబడవచ్చు.

ఉత్తమ పద్ధతులు