Документација: Користење на TacoTranslate

Користење на TacoTranslate

Macedonian

Преведување низи

Во моментов постојат три начини за превод на низа: Копонентата Translate, кујот useTranslation или алатката translateEntries.

Користење на Translate компонентата.
Прикажува преводи во рамките на span елемент и поддржува прикажување HTML.

import {Translate} from 'tacotranslate/react';

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

Можете да го промените типот на елементот користејќи, на пример, as="p" на компонента.

Користење на useTranslation hook.
Враќа преводи како обичен текст. Корисно, на пример, во meta тагови.

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 алатката.
Преведи низа на серверската страна. Засили ги твоите OpenGraph слики.

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

Кога стринговите ќе стигнат до нашите сервери, прво ги проверуваме и ги зачувуваме, а потоа веднаш враќаме машински превод. Иако машинските преводи генерално се со помал квалитет во споредба со нашите AI преводи, тие обезбедуваат брз првичен одговор.

Истовремено, иницираме асинхрона задача за превод за да генерираме висококвалитетен, современ AI превод за вашиот текст. Откако AI преводот ќе биде подготвен, тој ќе го замени машинскиот превод и ќе биде испратен секогаш кога ќе побарате преводи за вашите текстови.

Доколку сте рачно превеле низ, тие преводи имаат предност и се враќаат наместо тоа.

Користење на извори

Проектите на TacoTranslate содржат она што го нарекуваме origins. Замислете ги како влезни точки, папки или групи за вашите низи и преводи.

import {TacoTranslate} from 'tacotranslate/react';

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

Origins ви овозможуваат да ги разделите стринговите во смислени контејнери. На пример, можете да имате еден origin за документација и друг за вашата маркетинг страница.

За погранулиран контрола, можете да поставите origins на ниво на компонентата.

За да го постигнете ова, размислете за користење на повеќе TacoTranslate провајдери во рамките на вашиот проект.

Имајте предвид дека истиот текст може да добие различни преводи во различни origins.

На крајот, како ќе ги поделите низаите во оригинали зависи од вас и вашите потреби. Меѓутоа, имајте предвид дека ако има многу низаи во еден оригинал, тоа може да ги зголеми времињата на вчитување.

Ракување со променливи

Треба секогаш да користите променливи за динамична содржина, како што се имиња на корисници, датуми, е-пошта и повеќе.

Променливите во низа се декларираат со двојни заградувања, како {{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 содржина

По дифолт, Translate компонентата поддржува и го прикажува HTML содржината. Сепак, можете да се откажете од ова однесување така што ќе го поставите useDangerouslySetInnerHTML на false.

Силно се препорачува оневозможување на HTML рендерирање при превод на ненадежна содржина, како што е содржината генерирана од корисници.

Сите излезни податоци секогаш се дезинфицираат со 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}
		/>
	);
}

Горенаведениот пример ќе биде прикажан како обичен текст.

Рендерирање на серверот

Користење на TacoTranslate

Како се преведуваат низањата

Користење на извори

Ракување со променливи

Управување со HTML содржина