Dokumentacija: Uporaba TacoTranslate

Uporaba TacoTranslate

Slovenian

Prevajanje nizov

Trenutno so na voljo trije načini za prevajanje nizov: komponenta Translate, hook useTranslation, ali pripomoček translateEntries.

Uporaba komponente Translate.
Prikaže prevode znotraj elementa span, in podpira upodabljanje HTML.

import {Translate} from 'tacotranslate/react';

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

Vrsto elementa lahko spremenite tako, da na komponenti uporabite, na primer, as="p".

Uporaba useTranslation hooka.
Vrne prevode kot navaden niz. Uporabno je, na primer, v meta oznakah.

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

Uporaba pripomočka translateEntries.
Prevajajte nize na strežniški strani. Izboljšajte svoje OpenGraph slike.

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

Ko nizi prispejo na naše strežnike, jih najprej preverimo in shranimo, nato pa takoj vrnemo strojni prevod. Čeprav so strojni prevodi na splošno slabše kakovosti v primerjavi z našimi AI prevodi, zagotavljajo hiter začetni odziv.

Hkrati sprožimo asinhrono prevajalsko opravilo, da za vaš niz ustvarimo visokokakovosten, najsodobnejši AI-prevod. Ko bo AI-prevod pripravljen, bo nadomestil strojni prevod in ga bomo poslali vsakič, ko boste zahtevali prevode za vaše nize.

Če ste niz ročno prevedli, imajo ti prevodi prednost in se namesto tega vrnejo.

Uporaba izvorov

Projekti TacoTranslate vsebujejo tisto, čemur pravimo izvori. Razmislite o njih kot o vstopnih točkah, mapah ali skupinah za vaše nize in prevode.

import {TacoTranslate} from 'tacotranslate/react';

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

Origins vam omogočajo, da nize razdelite v smiselne vsebnike. Na primer, lahko imate en origin za dokumentacijo in drugega za vašo marketinško stran.

Za bolj natančen nadzor lahko na ravni komponente nastavite izvore.

Da to dosežete, razmislite o uporabi več TacoTranslate ponudnikov v vašem projektu.

Upoštevajte, da je isti niz lahko preveden različno v različnih izvorih.

Na koncu je vaša odločitev, kako razdeliti nize v izvore — odvisna je od vaših potreb. Vendar upoštevajte, da lahko veliko nizov v enem izvoru poveča čas nalaganja.

Ravnanje s spremenljivkami

Za dinamično vsebino vedno uporabljajte spremenljivke, na primer uporabniška imena, datume, e-poštne naslove in drugo.

Spremenljivke v nizih se deklarirajo z dvojnimi zavitimi oklepaji, na primer {{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}});
}

Upravljanje HTML-vsebine

Privzeto komponenta Translate podpira in prikazuje HTML vsebino. Če pa tega ne želite, lahko to vedenje izključite tako, da nastavite useDangerouslySetInnerHTML na false.

Močno priporočamo onemogočitev upodabljanja HTML pri prevajanju nezaupanja vredne vsebine, kot je vsebina, ki jo ustvarijo uporabniki.

Vsi izhodi so vedno očiščeni z sanitize-html pred prikazom.

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

Zgornji primer bo prikazan kot navadno besedilo.

Upodabljanje na strežniku

Uporaba TacoTranslate

Kako se nizi prevajajo

Uporaba izvorov

Ravnanje s spremenljivkami

Upravljanje HTML-vsebine