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

అధునాతన వాడుక

Telugu

కుడి నుండి ఎడమ (RTL) భాషలను నిర్వహించడం

TacoTranslate మీ React అనువర్తనాల్లో అరబిక్ మరియు హీబ్రూ వంటి కుడి నుంచి ఎడమకి (right-to-left, RTL) భాషలను సులభంగా మద్దతు చేయడానికి సహాయపడుతుంది. RTL భాషలను సక్రమంగా నిర్వహించడం కుడి నుంచి ఎడమకి చదివే వినియోగదారులకు మీ కంటెంట్ సరిగా ప్రదర్శించబడేలా చేస్తుంది.

import {useTacoTranslate} from 'tacotranslate/react';

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

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

మీరు React వెలుపల ప్రస్తుత భాషను తనిఖీ చేయడానికి అందించిన isRightToLeftLocaleCode ఫంక్షన్‌ను కూడా ఉపయోగించవచ్చు.

import {isRightToLeftLocaleCode} from 'tacotranslate';

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

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

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

import {Translate} from 'tacotranslate/react';

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

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

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

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

మీరు ఒరిజిన్లను ఉపయోగించే గురించి ఇక్కడ మరింత తెలుసుకోవచ్చు.

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

బహుభాషలు

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

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

ఒకే స్ట్రింగ్‌కు వివిధ అనువాదాలు లేదా అర్ధాలను నిర్వహించడానికి మీరు idని Translate కాంపోనెంట్‌కు జోడించవచ్చు. ఇది ప్రత్యేకంగా ఉపయోగకరంగా ఉంటుంది, ఒకే టెక్స్ట్ సన్నివేశం ఆధారంగా వేర్వేరు అనువాదాలు అవసరమయ్యే సందర్భాల్లో. ప్రత్యేకమైన 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” గా అనువదించవచ్చు.

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