Dokumentacija: Uporaba TacoTranslate

Uporaba TacoTranslate

Slovenian

Prevajanje nizov

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

Uporaba komponenta Translate.
Izpiše prevode znotraj elementa span, ter podpira prikaz HTML.

import {Translate} from 'tacotranslate/react';

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

Vrsto elementa lahko spremenite z uporabo na primer as="p" na komponenti.

Uporaba okulice useTranslation
Vrne prevode kot navaden niz. Uporabno 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 orodja translateEntries
Prevedite besedila na strežniški strani. Pospešite 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 dosežejo naše strežnike, jih najprej preverimo in shranimo, nato pa takoj vrnemo strojni prevod. Čeprav so strojni prevodi na splošno manj kakovostni v primerjavi z našimi AI prevodi, zagotovijo hiter začetni odziv.

Hkrati sprožimo asinhrono prevajalsko opravilo za ustvarjanje visokokakovostnega, najsodobnejšega AI prevoda za vaš niz. Ko bo AI prevod pripravljen, bo nadomestil strojni prevod in bo poslan vsakič, ko boste zahtevali prevode za vaše nize.

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

Uporaba izvorov

Projekti TacoTranslate vsebujejo tisto, čemur pravimo izviri. Lahko jih razumete kot vstopne točke, mape ali skupine 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 ločite 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 nastavitve origins opravite na ravni komponent.

Za dosego tega razmislite o uporabi več ponudnikov TacoTranslate v vašem projektu.

Upoštevajte, da lahko ista niz dobi različne prevode v različnih izvorih.

Na koncu je odločitev, kako razdelite nize na izvore, prepuščena vam in vašim potrebam. Vendar pa upoštevajte, da lahko velika količina nizov v enem izvoru poveča čas nalaganja.

Ravnanje s spremenljivkami

Vedno bi morali uporabljati spremenljivke za dinamično vsebino, kot so uporabniška imena, datumi, e-poštni naslovi in še več.

Spremenljivke v nizih so deklarirane z uporabo dvojnimi oglatimi 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 vsebine HTML

Privzeto komponenta Translate podpira in prikazuje HTML vsebino. Vendar se lahko odločite, da tega vedenja ne uporabljate, tako da nastavite vrednost useDangerouslySetInnerHTML na false.

Onemogočanje upodabljanja HTML je močno priporočeno pri prevajanju nezaupljive 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.

Upodobitev na strani strežnika

Uporaba TacoTranslate

Kako so nizi prevedeni

Uporaba izvorov

Ravnanje s spremenljivkami

Upravljanje vsebine HTML