Dokumentacion: Përdorim i avancuar

Përdorim i avancuar

Albanian

Trajtimi i gjuhëve nga e djathta në të majtë

TacoTranslate e bën të lehtë mbështetjen e gjuhëve nga e djathta në të majtë (RTL), si për shembull Arabe dhe Hebraisht, në aplikacionet tuaja React. Trajtimi i duhur i gjuhëve RTL siguron që përmbajtja juaj të shfaqet drejt për përdoruesit që lexojnë nga e djathta në të majtë.

import {useTacoTranslate} from 'tacotranslate/react';

function Document() {
	const {locale, isRightToLeft} = useTacoTranslate();

	return (
		<html lang={locale} dir={isRightToLeft ? 'rtl' : 'ltr'}>
			<body>
				// ...
			</body>
		</html>
	);
}

Ju gjithashtu mund të përdorni funksionin e ofruar isRightToLeftLocaleCode për të kontrolluar gjuhën aktuale jashtë React.

import {isRightToLeftLocaleCode} from 'tacotranslate';

function foo(locale = 'es') {
	const direction = isRightToLeftLocaleCode(locale) ? 'rtl' : 'ltr';
	// ...
}

Çaktivizimi i përkthimit

Për të çaktivizuar përkthimin për pjesë të caktuara të një vargu ose për të siguruar që segmentet e caktuara të ruhen ashtu si janë, mund të përdorni kllapa të trefishta katrore. Kjo veçori është e dobishme për të ruajtur formatin origjinal të emrave, termave teknikë, ose çdo përmbajtjeje tjetër që nuk duhet të përkthehet.

import {Translate} from 'tacotranslate/react';

function Component() {
	return (
		<Translate string="Hello, [[[TacoTranslate]]]!" />
	);
}

Në këtë shembull, fjala “TacoTranslate” do të mbetet e pandryshuar në përkthim.

Shumë ofrues të TacoTranslate

Ne inkurajojmë fuqishëm përdorimin e shumë furnizuesve TacoTranslate në aplikacionin tuaj. Kjo është e dobishme për organizimin e përkthimeve dhe vargjeve tuaja në origjina të ndryshme, si p.sh. në kokë, fund ose seksione specifike.

Ju mund të lexoni më shumë rreth përdorimit të origjinave këtu.

Ofertuesit e TacoTranslate trashëgojnë cilësimet nga çdo ofrues prindër, kështu që nuk do të duhet të përsëritni cilësime të tjera.

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

Mbivendosja e origjinës ose lokalitetit

Përveç përdorimit të shumë ofruesve TacoTranslate, ju gjithashtu mund të mbishkruani origjinën dhe lokalizimin në nivelet e komponentit Translate dhe hook-ut useTranslation.

import {Translate, useTranslation} from 'tacotranslate/react';

function Greeting() {
	const spanishHello = useTranslation('Hello!', {locale: 'es'});

	return (
		<>
			{spanishHello}
			<Translate string="What’s up?" origin="greeting" />
		</>
	);
}

Menaxhimi i ngarkimit

Kur ndryshoni gjuhët në anën e klientit, marrja e përkthimeve mund të zgjasë disa momente varësisht nga lidhja e përdoruesit. Ju mund të shfaqni një tregues ngarkimi për të përmirësuar përvojën e përdoruesit duke ofruar një reagim vizual gjatë ndërprerjes.

import {useTacoTranslate} from 'tacotranslate/react';

function Component() {
	const {isLoading} = useTacoTranslate();

	return (
		isLoading ? 'Translations are loading...' : null
	);
}

Shumëzim

Për të trajtuar shumësimin dhe për të shfaqur etiketat bazuar në numër në mënyrë korrekte në gjuhë të ndryshme, kjo konsiderohet praktika më e mirë:

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

Gjuhë të shumta

Për të mbështetur disa gjuhë njëkohësisht brenda të njëjtës aplikacion, ju mund të përdorni disa ofrues TacoTranslate me vlera të ndryshme locale siç tregohet më poshtë:

Ju gjithashtu mund të mbishkruani locale në nivelin e komponentit ose hook-ut.

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

Përdorimi i ID-ve të përkthimit

Ju mund të shtoni një id në komponentin Translate për të trajtuar përkthime ose kuptime të ndryshme për të njëjtin varg. Kjo është veçanërisht e dobishme kur i njëjti tekst kërkon përkthime të ndryshme bazuar në kontekst. Duke caktuar ID unike, siguroheni që çdo rast i vargut të përkthehet saktësisht sipas kuptimit të tij specifik.

import {Translate} from 'tacotranslate/react';

function Header() {
	return (
		<Translate id="header" string="Login" />
	);
}

function Footer() {
	return (
		<Translate id="footer" string="Login" />
	);
}

Për shembull, hyrja në krye mund të përkthehet si “Iniciar sesión”, dhe hyrja në këmbë mund të përkthehet si “Acceder” në spanjisht.

Praktikat më të mira