TacoTranslate-dən istifadə
Sətirlərin tərcüməsi
Hazırda sətirləri tərcümə etməyin üç yolu var: Translate komponenti, useTranslation hook-u, və ya translateEntries yardımçısı.
Translate komponentindən istifadə.
Tərcümələri span elementi daxilində göstərir və HTML renderlənməsini dəstəkləyir.
import {Translate} from 'tacotranslate/react';
function Page() {
return <Translate string="Hello, world!" />;
}Məsələn, komponentdə as="p" istifadə edərək element növünü dəyişə bilərsiniz.
useTranslation hookundan istifadə.
Tərcümələri sadə mətn sətiri kimi qaytarır. Məsələn, meta teqlərində faydalıdır.
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 utilitindən istifadə.
Sətirləri server tərəfində tərcümə edin. OpenGraph şəkillərinizi təkmilləşdirin.
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)
};
}Sətirlərin necə tərcümə olunduğu
Stringlər serverlərimizə çatdıqda əvvəlcə onları yoxlayır və saxlayırıq, daha sonra dərhal maşın tərcüməsini qaytarırıq. Maşın tərcümələri ümumiyyətlə bizim süni intellekt tərcümələrimizə nisbətən keyfiyyətcə daha aşağı olsa da, onlar sürətli ilkin cavab təqdim edir.
Eyni zamanda, biz asinxron tərcümə işi başlatırıq ki, sizin mətniniz üçün yüksək keyfiyyətli, ən müasir süni intellekt tərcüməsi yaradılsın. AI tərcümə hazır olanda, o maşın tərcüməsinin yerinə keçəcək və mətnləriniz üçün tərcümə tələb etdiyiniz zaman göndəriləcək.
Əgər bir sətri əl ilə tərcümə etmisinizsə, həmin tərcümələr üstünlük təşkil edir və digər tərcümələr əvəzinə qaytarılır.
Originlərdən istifadə
TacoTranslate layihələri bizim adlandırdığımız mənbələri ehtiva edir. Onları mətInləriniz və tərcümələriniz üçün giriş nöqtələri, qovluqlar və ya qruplar kimi düşünə bilərsiniz.
import {TacoTranslate} from 'tacotranslate/react';
function Menu() {
return (
<TacoTranslate origin="application-menu">
// ...
</TacoTranslate>
);
}Originlər sizə mətnləri məna daşıyan konteynerlərə ayırmağa imkan verir. Məsələn, sənədləşdirmə üçün bir origin, marketinq səhifəniz üçün isə başqa bir origin ola bilər.
Daha detallı nəzarət üçün originləri komponent səviyyəsində qura bilərsiniz.
Buna nail olmaq üçün layihənizdə bir neçə TacoTranslate provayderindən istifadə etməyi düşünün.
Nəzərə alın ki, eyni mətn müxtəlif originlərdə fərqli tərcümələr ala bilər.
Nəticədə, mətnləri originlərə necə ayırmağınız sizdən və ehtiyaclarınızdan asılıdır. Lakin nəzərə alın ki, bir origin daxilində çox sayda mətnin olması yükləmə vaxtını artıra bilər.
Dəyişənlərlə işləmə
Dinamik məzmun üçün — məsələn, istifadəçi adları, tarixlər, e‑poçt ünvanları və daha çox — həmişə dəyişənlərdən istifadə etməlisiniz.
Sətirlərdəki dəyişənlər qoşa mötərizələrdən istifadə edilərək elan edilir, məsələn {{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 məzmununun idarə edilməsi
Varsayılan olaraq, Translate komponenti HTML məzmununu dəstəkləyir və göstərir. Bununla belə, bu davranışdan imtina etmək üçün useDangerouslySetInnerHTML parametrini false olaraq təyin edə bilərsiniz.
İstifadəçilər tərəfindən yaradılan məzmun kimi etibarsız məzmunu tərcümə edərkən HTML render etməyi deaktiv etmək şiddətlə tövsiyə olunur.
Bütün çıxışlar render edilməzdən əvvəl həmişə sanitize-html ilə təmizlənir.
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}
/>
);
}Yuxarıdakı nümunə sadə mətn kimi göstəriləcək.