Dokumentācija: Papildu lietošana

Paplašināta izmantošana

Latvian

Darbs ar valodām, kuras raksta no labās uz kreiso pusi

TacoTranslate padara vieglu labošanas valodu (RTL), piemēram, arābu un ivritā, atbalstu jūsu React lietotnēs. Pareiza RTL valodu apstrāde nodrošina, ka jūsu saturs tiek pareizi rādīts 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 nodrošināto funkciju isRightToLeftLocaleCode, 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 atspējotu tulkošanu konkrētām virknes daļām vai nodrošinātu, ka noteikti segmenti tiek saglabāti nemainīti, varat izmantot trīskāršās kvadrātiekavas. Šī funkcija ir noderīga, lai saglabātu sākotnējo nosaukumu, tehnisko terminu vai cita satura formātu, kas nav paredzēts tulkošanai.

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 nodrošinātā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 izcelsmes avotos, piemēram, jūsu galvenē, kājenē vai konkrētās sadaļās.

Jūs varat lasīt vairāk par avotu izmantošanu šeit.

TacoTranslate piegādātāji manto iestatījumus no jebkura vecāku piegādā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>
	);
}

Pārrakstīt izcelsmi vai lokalizāciju

Papildus vairāku TacoTranslate nodrošinātāju izmantošanai, jūs varat arī pārrakstīt gan izcelsmi, gan lokalizāciju Translate komponenta un useTranslation hook 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" />
		</>
	);
}

Notikumu apstrāde ielādes laikā

Mainot valodas klienta pusē, tulkojumu ielāde var aizņemt dažas sekundes atkarībā no lietotāja savienojuma. Jūs varat parādīt ielādes indikatoru, lai uzlabotu lietotāja pieredzi, nodrošinot 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 veidošana

Lai pareizi apstrādātu skaitļošanas daudzskaitli un rādītu skaitā balstītus nosaukumus 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ā 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 arī varat 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žādas tulkojumus vai nozīmes vienam un tam pašam tekstam. Tas ir īpaši noderīgi, ja vienam tekstam konteksta dēļ ir nepieciešami dažādi tulkojumi. Piešķirot unikālus ID, jūs nodrošināt, ka katra teksta instance tiek precīzi tulkota 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 pieslēgšanās var tikt tulkota kā “Iniciar sesión”, bet kājenes pieslēgšanās var tikt tulkota kā “Acceder” spāņu valodā.

Labākās prakses