TacoTranslate
/
दस्तऐवजीकरणकिंमत
 
  1. परिचय
  2. सुरूवात
  3. सेटअप आणि कॉन्फिगरेशन
  4. TacoTranslate वापरणे
  5. सर्व्हर-साइड रेंडरिंग
  6. प्रगत वापर
  7. सर्वोत्तम पद्धती
  8. त्रुटी हाताळणी आणि डिबगिंग
  9. समर्थित भाषा

प्रगत वापर

उजवीकडून डावीकडे लिहिल्या जाणाऱ्या भाषा हाताळणे

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 प्रदाते वापरण्याची जोरदार शिफारस करतो. हे तुमच्या अनुवादांना आणि स्ट्रिंग्सना वेगवेगळ्या ओरिजिनमध्ये, जसे की हेडर, फूटर किंवा विशिष्ट विभागांमध्ये, व्यवस्थित करण्यासाठी उपयुक्त आहे.

आपण येथे ऑरिजिन्स वापरण्याबद्दल अधिक वाचू शकता.

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

मूळ (origin) किंवा लोकॅल (locale) अधिलेखित करणे

अनेक TacoTranslate प्रदात्यांचा वापर करण्यासोबतच, आपण Translate घटक आणि useTranslation हुकच्या स्तरांवर मूळ आणि स्थानिक दोन्ही ओव्हरराईड करू शकता.

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 Translate कंपोनेंटमध्ये जोडू शकता जेणेकरून समान स्ट्रिंगसाठी वेगवेगळ्या भाषांतरं किंवा अर्थ हाताळता येतील. हे विशेषतः उपयुक्त आहे जेव्हा त्याच मजकुराला संदर्भानुसार वेगवेगळ्या भाषांतरांची आवश्यकता असते. अद्वितीय आयडी नियुक्त करून, तुम्ही सुनिश्चित करता की त्या स्ट्रिंगच्या प्रत्येक उदाहरणाचे भाषांतर त्याच्या विशिष्ट अर्थानुसार अचूकपणे केले जाईल.

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” असे अनुवादित होऊ शकतात.

सर्वोत्तम पद्धती

Nattskiftet चे उत्पादननॉर्वेमध्ये बनवले