Përdorimi i TacoTranslate
Përkthimi i vargjeve
Aktualisht ekzistojnë tre mënyra për të përkthyer vargjet: Komponenti Translate, hook-u useTranslation, ose utiliteti translateEntries.
Përdorimi i komponentit Translate.
Shfaq përkthimet brenda një elementi span, dhe mbështet renderimin e HTML-it.
import {Translate} from 'tacotranslate/react';
function Page() {
return <Translate string="Hello, world!" />;
}Mund të ndryshoni tipin e elementit duke përdorur, për shembull, as="p" në komponent.
Përdorimi i hook-ut useTranslation.
Kthen përkthimet si një varg të thjeshtë. I përshtatshëm, për shembull, për etiketat 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>
);
}Përdorimi i mjetit translateEntries.
Përkthe vargjet në anën e serverit. Përforco imazhet tuaja 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)
};
}Si përkthehen vargjet
Kur vargjet arrijnë në serverat tanë, ne së pari i verifikojmë dhe i ruajmë, pastaj menjëherë kthejmë një përkthim makinerik. Ndërsa përkthimet makinerike zakonisht kanë cilësi më të ulët krahasuar me përkthimet tona me AI, ato ofrojnë një përgjigje fillestare të shpejtë.
Njëkohësisht, nisim një detyrë asinkrone për përkthim për të gjeneruar një përkthim me AI të cilësisë së lartë dhe më të avancuar për vargun tuaj. Sapo përkthimi me AI të jetë gati, ai do të zëvendësojë përkthimin automatik dhe do të dërgohet sa herë që të kërkoni përkthime për vargjet tuaja.
Nëse keni përkthyer manualisht një varg, këto përkthime kanë përparësi dhe rikthehen në vend të përkthimeve të tjera.
Përdorimi i origjinave
Projektet TacoTranslate përmbajnë atë që ne e quajmë origins. Mendoni për to si pika hyrjeje, dosje ose grupe për tekstet dhe përkthimet tuaja.
import {TacoTranslate} from 'tacotranslate/react';
function Menu() {
return (
<TacoTranslate origin="application-menu">
// ...
</TacoTranslate>
);
}Origjinat ju lejojnë të ndani vargjet në kontejnerë kuptimplotë. Për shembull, mund të keni një origjinë për dokumentacionin dhe një tjetër për faqen tuaj të marketingut.
Për kontroll më të detajuar, mund të konfiguroni origjinat në nivelin e komponentit.
Për ta arritur këtë, merrni parasysh përdorimin e disa ofruesve të TacoTranslate brenda projektit tuaj.
Ju lutemi vini re se i njëjti varg mund të marrë përkthime të ndryshme në origjina të ndryshme.
Në fund të fundit, mënyra se si i ndan vargjet në origjinat varet nga ju dhe nga nevojat tuaja. Megjithatë, kini parasysh se të kesh shumë vargje brenda një origjine mund të rrisë kohën e ngarkimit.
Trajtimi i variablave
Duhet gjithmonë të përdorni variabla për përmbajtje dinamike, si emrat e përdoruesve, datat, adresat e postës elektronike dhe më shumë.
Variablat në vargje deklarohen duke përdorur kllapa të dyfishta, si {{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}});
}Menaxhimi i përmbajtjes HTML
Si parazgjedhje, komponenti Translate mbështet dhe shfaq përmbajtje HTML. Megjithatë, mund ta çaktivizoni këtë sjellje duke vendosur useDangerouslySetInnerHTML në false.
Çaktivizimi i renderimit HTML rekomandohet fort kur përktheni përmbajtje të pasigurta, si përmbajtja e krijuar nga përdoruesit.
Të gjitha daljet gjithmonë pastrohen me sanitize-html para se të shfaqen.
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}
/>
);
}Shembulli më sipër do të shfaqet si tekst i thjeshtë.