Dokumentacioni: Përdorimi 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ç janë Arabishtja dhe Hebraishtja, në aplikacionet tuaja React. Trajtimi i duhur i gjuhëve RTL siguron që përmbajtja juaj të shfaqet saktë 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 dhënë 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ë segmente të caktuara të ruhen sic janë, mund të përdorni kllapa të trefishta katrore. Kjo veçori është e dobishme për të mbajtur formatin origjinal të emrave, termeve teknike, 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 paprekur në përkthim.

Ofrues të shumtë TacoTranslate

Ne inkurajojmë fuqimisht përdorimin e shumë ofruesve TacoTranslate në aplikacionin tuaj. Kjo është e dobishme për organizimin e përkthimeve dhe vargjeve tuaja në origjina të ndryshme, si p.sh. krye, fundose ose seksione specifike.

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

Ofertuesit TacoTranslate trashëgojnë cilësimet nga çdo ofrues prind, kështu që nuk do t'ju duhet të përsëritni ndonjë cilësim tjetër.

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ë mbivendosni origjinën dhe lokalizimin në nivelin 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" />
		</>
	);
}

Trajtimi i ngarkimit

Kur ndryshoni gjuhët në anën e klientit, marrja e përkthimeve mund të marrë disa momente në varësi të lidhjes së përdoruesit. Mund të shfaqni një tregues ngarkimi për të përmirësuar përvojën e përdoruesit duke ofruar një feedback vizual gjatë ndryshimit.

import {useTacoTranslate} from 'tacotranslate/react';

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

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

Numërimi i shumës

Për të trajtuar shumësinë dhe për të shfaqur saktë etiketa bazuar në numër në gjuhë të ndryshme, kjo konsiderohet praktikë 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 shumë gjuhë njëkohësisht brenda të njëjtës aplikacion, mund të përdorni ofrues të shumtë 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

Mund të shtoni një id te komponenti Translate për të trajtuar përkthime ose kuptime të ndryshme për të njëjtën varg. Kjo është veçanërisht e dobishme kur i njëjti tekst kërkon përkthime të ndryshme në varësi të kontekstit. Duke asignuar ID unike, siguroheni që çdo rast i vargut të përkthehet saktë 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 në “Iniciar sesión”, dhe hyrja në fund mund të përkthehet në “Acceder” në spanjisht.

Praktikat më të mira