Dokumentatsioon: TacoTranslate'i kasutamine

TacoTranslate'i kasutamine

Estonian

Stringide tõlkimine

Praegu on stringide tõlkimiseks kolm võimalust: Translate komponent, useTranslation hook või utiliit translateEntries.

Translate komponendi kasutamine.
Kuvab tõlkeid span elemendi sees ning toetab HTML-i renderdamist.

import {Translate} from 'tacotranslate/react';

function Page() {
	return <Translate string="Hello, world!" />;
}

Näiteks saate komponendil elemendi tüübi muuta, kasutades as="p".

useTranslation hooki kasutamine.
Tagastab tõlked tavalise stringina. Kasulik näiteks meta siltides.

import {useEffect} from 'react';
import {useTranslation} from 'tacotranslate/react';

function Page() {
	const helloWorld = useTranslation('Hello, world!');

	useEffect(() => {
		alert(helloWorld);
	}, [helloWorld]);

	return (
		<title>{useTranslation('My page title')}</title>
	);
}

translateEntries utiliidi kasutamine.
Tõlgi stringid serveripoolselt. Võimenda oma OpenGraph pilte.

import {createEntry, translateEntries} from 'tacotranslate';

async function generateMetadata(locale = 'es') {
	const title = createEntry({string: 'Hello, world!'});
	const description = createEntry({string: 'TacoTranslate on the server'});

	const translations = await translateEntries(
		tacoTranslate,
		{origin: 'opengraph', locale},
		[title, description]
	);

	return {
		title: translations(title),
		description: translations(description)
	};
}

Kui stringid jõuavad meie serveritesse, valideerime ja salvestame need esmalt ning tagastame kohe masintõlke. Kuigi masintõlked on üldiselt meie tehisintellekti tõlgetest madalama kvaliteediga, annavad need kiire esmase vastuse.

Üheaegselt alustame asünkroonset tõlketööd, et genereerida teie stringile tipptasemel tehisintellekti tõlge. Kui tehisintellekti tõlge on valmis, asendab see masintõlget ja saadetakse alati, kui taotlete oma stringide tõlkeid.

Kui olete stringi käsitsi tõlkinud, omavad need tõlked eelistust ning need tagastatakse.

Originide kasutamine

TacoTranslate projektid sisaldavad seda, mida me nimetame origins. Mõelge neile kui teie stringide ja tõlgete sisenemispunktidele, kaustadele või gruppidele.

import {TacoTranslate} from 'tacotranslate/react';

function Menu() {
	return (
		<TacoTranslate origin="application-menu">
			// ...
		</TacoTranslate>
	);
}

Originid võimaldavad eraldada stringid tähendusrikastesse konteineritesse. Näiteks võiks olla üks origin dokumentatsiooni jaoks ja teine turunduslehe jaoks.

Täpsema kontrolli jaoks võiksite komponendi tasemel originid seadistada.

Selle saavutamiseks kaaluge mitme TacoTranslate pakkuja kasutamist oma projektis.

Pange tähele, et sama string võib saada erinevaid tõlkeid erinevates allikates.

Lõppkokkuvõttes sõltub stringide jagamine originitesse teie eelistustest ja vajadustest. Siiski tasub märkida, et paljude stringide hoidmine ühes originis võib suurendada laadimisaegu.

Muutujate käsitlemine

Peaksite alati kasutama muutujaid dünaamilise sisu jaoks, näiteks kasutajanimesid, kuupäevi, e-posti aadresse jne.

Stringides olevad muutujad deklareeritakse, kasutades topeltsulgusid, näiteks {{variable}}.

import {Translate} from 'tacotranslate/react';

function Greeting() {
	const name = 'Juan';
	return <Translate string="Hello, {{name}}!" variables={{name}} />;
}

import {useTranslation} from 'tacotranslate/react';

function useGreeting() {
	const name = 'Juan';
	return useTranslation('Hello, {{name}}!', {variables: {name}});
}

HTML-sisu haldamine

Vaikimisi toetab ja renderdab Translate komponent HTML-sisu. Siiski võite sellest käitumisest loobuda, seadistades useDangerouslySetInnerHTML väärtuseks false.

HTML-renderdamise keelamine on tungivalt soovitatav, kui tõlgitakse usaldamatut sisu, näiteks kasutajate loodud sisu.

Kõik väljundid puhastatakse enne kuvamist alati sanitize-html.

import {Translate} from 'tacotranslate/react';

function Page() {
	return (
		<Translate
			string={`
				Welcome to <strong>my</strong> website.
				I’m using <a href="{{url}}">TacoTranslate</a> to translate text.
			`}
			variables={{url: 'https://tacotranslate.com'}}
			useDangerouslySetInnerHTML={false}
		/>
	);
}

Ülaltoodud näide kuvatakse lihttekstina.

Serveripoolne renderdamine

TacoTranslate'i kasutamine

Kuidas stringid tõlgitakse

Originide kasutamine

Muutujate käsitlemine

HTML-sisu haldamine