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

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

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';
	// ...
}

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

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

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”గా స్పానిష్‌లో అనువదించబడవచ్చు.

ఉత్తమ ఆచరణలు