دستاویزات: اعلی درجے کا استعمال

اعلی درجے کا استعمال

Urdu

دائیں سے بائیں زبانوں سے نمٹنا

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 پرووائیڈرز کے استعمال کی سختی سے سفارش کرتے ہیں۔ یہ آپ کے تراجم اور سٹرنگز کو مختلف ماخذوں میں منظم کرنے کے لیے مفید ہے، جیسے آپ کا ہیڈر، فوٹر، یا مخصوص حصے۔

آپ 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 providers استعمال کر سکتے ہیں جیسا کہ نیچے دکھایا گیا ہے:

آپ 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 تفویض کر کے، آپ یقینی بناتے ہیں کہ متن کی ہر مثال اس کے مخصوص معنی کے مطابق درست طور پر ترجمہ ہو۔

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” ہسپانوی میں ہو سکتا ہے۔

بہترین طریقۂ کار