Përdorimi i TacoTranslate
Përkthimi i vargjeve
Aktualisht ka tre mënyra për të përkthyer stringjet: Komponenti Translate, hooku useTranslation, ose mjeti translateEntries.
Përdorimi i komponentit Translate.
Shfaq përkthime brenda një elementi span, dhe mbështet renderimin e HTML-së.
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ërkthime si një varg të thjeshtë. I dobishëm, për shembull, në 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ërktheni vargjet në anën e serverit. Përforconi 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ë serverët tanë, së pari i verifikojmë dhe i ruajmë, pastaj menjëherë kthejmë një përkthim automatik. Ndërsa përkthimet automatike përgjithësisht kanë cilësi më të ulët krahasuar me përkthimet tona me AI, ato sigurojnë një përgjigje të shpejtë fillestare.
Njëkohësisht, ne nisim një punë përkthimi asinkrone për të gjeneruar një përkthim me cilësi të lartë, të avancuar me AI, për tekstin tuaj. Sapo përkthimi i AI-së të jetë gati, ai do të zëvendësojë përkthimin e makinës dhe do të dërgohet sa herë që kërkoni përkthime për tekstet tuaja.
Nëse keni përkthyer manualisht një string, ato përkthime kanë përparësi dhe kthehen në vend të tjerave.
Përdorimi i origjinave
Projektet TacoTranslate përmbajnë atë që ne e quajmë origjinat. Mendojini ato si pika hyrëse, 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 tekstet në grupe me kuptim. 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ë hollësishëm, mund të konfiguroni origjinat në nivelin e komponentit.
Për ta arritur këtë, konsideroni përdorimin e disa ofruesve të TacoTranslate në projektin tuaj.
Ju lutemi vini re se i njëjti tekst 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 të përdorni gjithmonë variabla për përmbajtje dinamike, si p.sh. emrat e përdoruesve, datat, adresat e postës elektronike dhe të tjera.
Variablat në vargje deklarohen me 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 paraqet përmbajtje HTML. Megjithatë, mund të çaktivizoni këtë sjellje duke vendosur useDangerouslySetInnerHTML në false.
Rekomandohet fuqimisht çaktivizimi i renderimit të HTML-it kur përkthehen përmbajtje të pasigurta, si p.sh. 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ë.