TacoTranslate-dən istifadə etmək
Sətirlərin tərcüməsi
Hal-hazırda mətnləri tərcümə etməyin üç yolu var: Translate
komponenti, useTranslation
hook-u və ya translateEntries
utiliti.
Translate
komponentindən istifadə.
Tərcümələri span
elementi daxilində çıxarır və HTML render edilmə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
hook-dan istifadə.
Tərcümələri sadə mətn 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ə.
Simləri server tərəfində tərcümə edin. OpenGraph şəkillərinizi gücləndirin.
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ər necə tərcümə olunur
Sətirlər serverlərimizə çatdıqda, əvvəlcə onları doğrulayır və saxlayırıq, sonra dərhal maşın tərcüməsini qaytarırıq. Maşın tərcümələri ümumiyyətlə AI tərcümələrimizə nisbətən keyfiyyətcə aşağı olsa da, sürətli ilkin cavab təmin edirlər.
Eyni vaxtda, siminiz üçün yüksək keyfiyyətli, ən son texnologiyaya malik AI tərcüməsi yaratmaq üçün asinxron tərcümə işi başladırıq. AI tərcüməsi hazır olduqdan sonra, o, maşın tərcüməsinin yerini tutacaq və siz simləriniz üçün tərcümə tələb etdiyiniz zaman göndəriləcək.
Əgər yazını əl ilə tərcümə etmisinizsə, həmin tərcümələr üstünlük təşkil edir və onların nəticəsi qaytarılır.
Mənbələrdən istifadə etmək
TacoTranslate layihələri içərisində orijinlər adlandırdığımız şeylər mövcuddur. Onları sətirlə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>
);
}
Origins 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 incə tənzimləmə üçün, siz tərkib səviyyəsində originləri qura bilərsiniz.
Buna nail olmaq üçün layihənizdə birdən çox TacoTranslate təchizatçısından istifadə etməyi nəzərdən keçirin.
Zəhmət olmasa qeyd edin ki, eyni mətn fərqli originlərdə fərqli tərcümələr ala bilər.
Nəhayət, sətirləri orijinlərə necə ayırmaq sizin və ehtiyaclarınızın qərarına bağlıdır. Lakin qeyd etmək lazımdır ki, bir orijində çox sayda sətir olması yükləmə vaxtlarını artıra bilər.
Dəyişənlərin idarə olunması
Dinamik məzmun, məsələn, istifadəçi adları, tarixlər, e-poçt ünvanları və s. üçün həmişə dəyişənlərdən istifadə etməlisiniz.
Simvollər mətnlərdə cüt mötərizə ilə 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
Defolt olaraq, Translate
komponenti HTML məzmununu dəstəkləyir və göstərir. Lakin, useDangerouslySetInnerHTML
dəyərini false
olaraq təyin etməklə bu davranışdan çıxmaq olar.
İstifadəçi tərəfindən yaradılan məzmun kimi etibarsız məzmun tərcümə edilərkən HTML-rendərləmənin qeyri-aktiv edilməsi güclü şəkildə tövsiyə olunur.
Bütün çıxış həmişə göstərilməzdən əvvəl 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.