TacoTranslate
/
DokumentasiePryse
 
  1. Inleiding
  2. Aan die gang kom
  3. Instelling en konfigurasie
  4. Gebruik TacoTranslate
  5. Bediener-kant rendering
  6. Gevorderde gebruik
  7. Beste praktyke
  8. Fouthantering en foutopsporing
  9. Ondersteunde tale

Gebruik TacoTranslate

Vertaling van stringe

Daar is tans drie maniere om stringe te vertaal: Die Translate komponent, die useTranslation hook, of die translateEntries nutsding.


Gebruik van die Translate komponent.
Gee vertalings binne ʼn span element uit, en ondersteun die weergawe van HTML.

import {Translate} from 'tacotranslate/react';

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

Jy kan die elementtipe verander deur byvoorbeeld as="p" op die komponent te gebruik.


Gebruik van die useTranslation hook.
Gee vertalings as ’n eenvoudige string terug. Nuttig byvoorbeeld in meta etikette.

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

Gebruik van die translateEntries nutsding.
Vertaal stringe aan die bedienerkant. Gee krag aan jou OpenGraph beelde.

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

Hoe stringe vertaal word

Wanneer stringe ons bedieners bereik, valideer en stoor ons dit eers, en gee dan onmiddellik ʼn masjienvertaling terug. Alhoewel masjienvertalings oor die algemeen laer kwaliteit het in vergelyking met ons KI-vertalings, bied hulle ʼn vinnige aanvanklike reaksie.

Terselfdertyd begin ons ’n asynchrone vertaaltaak om ’n hoë kwaliteit, gesofistikeerde KI-vertaling vir jou string te genereer. Sodra die KI-vertaling gereed is, sal dit die masjienvertaling vervang en word dit gestuur wanneer jy vertalings vir jou stringe versoek.

As jy ’n string met die hand vertaal het, gaan daardie vertalings voor en word dit in plaas daarvan teruggegee.

Gebruik van oorspronge

TacoTranslate-projekte bevat wat ons origins noem. Dink daaraan as toegangspunte, vouers, of groepe vir jou stringe en vertalings.

import {TacoTranslate} from 'tacotranslate/react';

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

Oorspronge laat jou toe om stringe in betekenisvolle houers te skei. Byvoorbeeld, jy kan een oorsprong hê vir dokumentasie en 'n ander vir jou bemarkingsblad.

Vir meer gedetailleerde beheer, kan jy oorspronge op die komponentvlak instel.

Om dit te bereik, oorweeg dit om meervoudige TacoTranslate verskaffers binne jou projek te gebruik.

Let asseblief daarop dat dieselfde string verskillende vertalings in verskillende oorspronge kan ontvang.

Uiteindelik is dit aan u en u behoeftes om stringe in oorspronge te skei. Neem egter kennis dat die hê van baie stringe binne een oorsprong laai-tye kan laat toeneem.

Hantering van veranderlikes

Jy moet altyd veranderlikes gebruik vir dinamiese inhoud, soos gebruikersname, datums, e-posadresse, en meer.

Veranderlikes in stringe word gedeclareer met dubbel hakies, soos {{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}});
}

Bestuur van HTML-inhoud

Standaard ondersteun en render die Translate komponent HTML-inhoud. U kan egter hierdie gedrag afskakel deur useDangerouslySetInnerHTML op false te stel.

Dit word sterk aanbeveel om HTML-weergawes uit te skakel wanneer u onbetroubare inhoud vertaal, soos deur gebruikers gegenereerde inhoud.

Alle uitvoer word altyd gesuiwer met sanitize-html voordat dit vertoon word.

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

Die bogenoemde voorbeeld sal as eenvoudige teks vertoon word.

Bediener-kant rendering

'n Produk van NattskiftetGemaak in Noorweë