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

आपण सध्याचा भाषा React च्या बाहेर तपासण्यासाठी प्रदान केलेला isRightToLeftLocaleCode फंक्शन देखील वापरू शकता.

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

मूळ किंवा स्थानिक भाषा अधिलेखन करणे

एकाधिक 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)}}
		/>
	);
}

एकाधिक भाषा

एकाच अनुप्रयोगात एकाच वेळी अनेक भाषा समर्थन करण्यासाठी, आपण वेगवेगळ्या 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>
	);
}

अनुवाद आयडी वापरणे

आपण समान स्ट्रिंगसाठी वेगवेगळ्या भाषांतर किंवा अर्थ हाताळण्यासाठी 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” असे होऊ शकते.

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

Nattskiftet कडून एक उत्पादननोंवेपासून बनवलेले