Papildu lietošana
Darbs ar valodām, kuras raksta no labās uz kreiso pusi
TacoTranslate padara vienkāršu atbalstu valodām, kas tiek rakstītas no labās uz kreiso pusi (RTL), piemēram, arābu un ivritā, jūsu React lietotnēs. Pareiza RTL valodu apstrāde nodrošina, ka jūsu saturs tiek pareizi attēlots lietotājiem, kas 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 nodoto funkciju isRightToLeftLocaleCode
pašreizējās valodas pārbaudei ārpus React.
import {isRightToLeftLocaleCode} from 'tacotranslate';
function foo(locale = 'es') {
const direction = isRightToLeftLocaleCode(locale) ? 'rtl' : 'ltr';
// ...
}
Tulkošanas atspējošana
Lai atslābinātu tulkojumu konkrētām teksta 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 nedrīkst tikt tulkots.
import {Translate} from 'tacotranslate/react';
function Component() {
return (
<Translate string="Hello, [[[TacoTranslate]]]!" />
);
}
Šajā piemērā vārds “TacoTranslate” tulkojumā paliks nemainīgs.
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 avotos, piemēram, jūsu galvenē, kājenē vai konkrētās sadaļās.
Jūs varat lasīt vairāk par izcelsmes izmantošanu šeit.
TacoTranslate
pakalpojumu sniedzēji mantos iestatījumus no jebkura vecāku pakalpojumu sniedzē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ārkārtošana pēc izcelsmes vai lokalizācijas
Papildus vairāku TacoTranslate
nodrošinātāju izmantošanai, jūs varat arī pārrakstīt gan origin, gan locale 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" />
</>
);
}
Iekraušanas apstrāde
Mainot valodu klienta pusē, tulkojumu ielāde var aizņemt dažas sekundes atkarībā no lietotāja savienojuma. Varat parādīt ielādes indikatoru, lai uzlabotu lietotāja pieredzi, nodrošinot vizuālu atsauksmi valodas maiņas 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 parādītu skaitļu bāzē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 vienā lietotnē vienlaikus atbalstītu vairākas valodas, jūs varat izmantot vairākus TacoTranslate
nodrošinātājus ar atšķirīgām locale
vērtībām, kā parādīts zemāk:
Varat arī pārdefinē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
komponentam Translate
, lai apstrādātu dažādas tulkošanas vai nozīmes vienam un tam pašam tekstam. Tas ir īpaši noderīgi, ja tas pats teksts kontekstā prasa atšķirīgas tulkošanas. Piešķirot unikālus ID, jūs nodrošināt, ka katrs teksta instances tiek precīzi tulkots atbilstoši tā specifiskajai 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”, un kājenes pieteikšanās var tikt tulkota kā “Acceder” spāņu valodā.