ਡੌਕਯੂਮੈਂਟੇਸ਼ਨ: ਉन्नਤ ਵਰਤੋਂ

ਉੱਨਤ ਵਰਤੋਂ

Punjabi

ਸੱਜੇ ਤੋਂ ਖੱਬੇ ਭਾਸ਼ਾਵਾਂ ਨੂੰ ਸੰਭਾਲਣਾ

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 ਹੂਕ ਲੈਵਲਾਂ 'ਤੇ ਮੂਲ ਅਤੇ ਭਾਸ਼ਾ ਦੋਹਾਂ ਨੂੰ ਵੀ ਓਵਰਰਾਈਡ ਕਰ ਸਕਦੇ ਹੋ।

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

ਅਨੁਵਾਦ ID ਦੀ ਵਰਤੋਂ ਕਰਨਾ

ਤੁਸੀਂ Translate ਕੰਪੋਨੈਂਟ ਵਿੱਚ ਵੱਖ-ਵੱਖ ਅਨੁਵਾਦ ਜਾਂ ਮਤਲਬਾਂ ਨੂੰ ਸੰਭਾਲਣ ਲਈ ਇੱਕ id ਜੋੜ ਸਕਦੇ ਹੋ। ਇਹ ਖਾਸ ਕਰਕੇ ਤਾਂਗ ਹੈ ਜਦੋਂ ਇੱਕੋ ਹੀ ਲਫ਼ਜ਼ ਨੂੰ ਸੰਦਰਭ ਅਨੁਸਾਰ ਵੱਖ-ਵੱਖ ਅਨੁਵਾਦਾਂ ਦੀ ਲੋੜ ਹੋਵੇ। ਵੱਖਰੇ 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” ਹੋ ਸਕਦਾ ਹੈ।

ਸਭ ਤੋਂ ਵਧੀਆ ਅਭਿਆਸ