Документација: Користење на 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 содржат она што ние го нарекуваме оригини. Помислете на нив како точки на влез, папки или групи за вашите низи и преводи.

import {TacoTranslate} from 'tacotranslate/react';

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

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

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

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

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

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

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

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

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