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

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

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

آپ یہاں ماخذات کے استعمال کے بارے میں مزید پڑھ سکتے ہیں۔

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 فراہم کنندگان استعمال کر سکتے ہیں:

آپ locale کو component یا hook کی سطح پر بھی override کر سکتے ہیں۔

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

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” ہو سکتا ہے۔

بہترین طریقے