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ërkthimet 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>
);
}Duke përdorur mjetin translateEntries.
Përkthe vargjet në anën e serverit. Fuqizo 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 tekstet arrijnë në serverët tanë, ne së pari i verifikojmë dhe i ruajmë, pastaj menjëherë kthejmë një përkthim automatik. Ndërsa përkthimet automatike zakonisht kanë cilësi më të ulët krahasuar me përkthimet tona me AI, ato ofrojnë 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ë varg, ato përkthime kanë përparësi dhe kthehen në vend të tjerave.
Përdorimi i origjinave
Projektet e TacoTranslate përmbajnë atë që ne e quajmë origjina. Mendojini ato 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 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 të përdorni disa ofrues 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 si i ndan vargjet në origjina varet nga ju dhe nga nevojat tuaja. Megjithatë, kini parasysh se pasja e shumë vargjeve 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 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 të HTML-it rekomandohet fuqimisht kur përktheni përmbajtje të pa besueshme, si p.sh. përmbajtje e krijuar nga përdoruesit.
Të gjitha daljet gjithmonë sanitizohen 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ë.