Dokumentācija: Paplašināta lietošana

Padziļināta izmantošana

Latvian

Darbs ar valodām, kas rakstītas no labās uz kreiso pusi

TacoTranslate atvieglo atbalstu valodām, kas rakstās no labās uz kreiso pusi (RTL), piemēram, arābu un ebreju valodām, jūsu React lietojumprogrammās. Pareiza RTL valodu apstrāde nodrošina, ka jūsu saturs tiek pareizi attēlots lietotājiem, kuri lasa no labās uz kreiso pusi.

import {useTacoTranslate} from 'tacotranslate/react';

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

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

Jūs varat arī izmantot piedāvāto isRightToLeftLocaleCode funkciju, lai pārbaudītu pašreizējo valodu ārpus React.

import {isRightToLeftLocaleCode} from 'tacotranslate';

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

Tulkošanas atspējošana

Lai izslēgtu tulkošanu virknes noteiktām daļām vai nodrošinātu, ka daži segmenti tiek saglabāti nemainīti, varat izmantot trīs kvadrātiekavas. Šī funkcija noder, lai saglabātu personu vārdus, tehniskos terminus vai jebkuru citu saturu, kuru nevajadzētu tulkot.

import {Translate} from 'tacotranslate/react';

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

Šajā piemērā vārds “TacoTranslate” paliks nemainīts tulkojumā.

Vairāki TacoTranslate pakalpojumu sniedzēji

Mēs stingri iesakām izmantot vairākus TacoTranslate pakalpojumu sniedzējus jūsu lietotnē. Tas ir noderīgi, lai organizētu jūsu tulkojumus un tekstus dažādos avotos, piemēram, galvenē, kājenē vai konkrētās sadaļās.

Varat lasīt vairāk par originu izmantošanu šeit.

TacoTranslate nodrošinātāji manto iestatījumus no jebkura vecāka nodrošinātāja, tāpēc jums nebūs jāatkārto citi iestatījumi.

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

Avota vai lokāles pārrakstīšana

Papildus vairāku TacoTranslate nodrošinātāju izmantošanai, varat arī pārrakstīt gan origin, gan locale Translate komponenta un useTranslation hooka līmeņos.

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

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

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

Ielādes apstrāde

Mainot valodu klienta pusē, tulkojumu ielāde var aizņemt kādu brīdi atkarībā no lietotāja savienojuma. Varat parādīt ielādes indikatoru, lai uzlabotu lietotāja pieredzi, sniedzot vizuālu atgriezenisko saiti pārslēgšanās laikā.

import {useTacoTranslate} from 'tacotranslate/react';

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

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

Daudzskaitļa forma

Lai pareizi apstrādātu daudzskaitli un attēlotu ar skaitu saistītas etiķetes dažādās valodās, tas tiek uzskatīts par labāko praksi:

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

Vairākas valodas

Lai vienlaikus atbalstītu vairākas valodas vienā un tajā pašā lietotnē, jūs varat izmantot vairākus TacoTranslate nodrošinātājus ar dažādām locale vērtībām, kā parādīts zemāk:

Jūs varat arī pārrakstīt locale komponenta vai hook līmenī.

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

Tulkojumu ID izmantošana

Jūs varat pievienot id Translate komponentam, lai apstrādātu dažādus tulkojumus vai nozīmes vienai un tai pašai teksta virknei. Tas ir īpaši noderīgi, ja viens un tas pats teksts kontekstā prasa dažādus tulkojumus. Piešķirot unikālus ID, jūs nodrošināt, ka katra šīs virknes izpausme tiek tulkota precīzi atbilstoši tās konkrētajai nozīmei.

import {Translate} from 'tacotranslate/react';

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

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

Piemēram, galvenes pieteikšanās var tikt tulkota kā “Iniciar sesión”, bet kājenes pieteikšanās var tikt tulkota kā “Acceder” spāņu valodā.

Labākā prakse