Duke përdorur TacoTranslate
Përkthimi i vargjeve
Aktualisht ekzistojnë tre mënyra për të përkthyer stringjet: Komponenti Translate
, hook-u useTranslation
, ose utiliti translateEntries
.
Përdorimi i komponentit Translate
.
Shfaq përkthimet brenda një elementi span
, dhe mbështet paraqitjen e HTML-së.
import {Translate} from 'tacotranslate/react';
function Page() {
return <Translate string="Hello, world!" />;
}
Ju mund të ndryshoni llojin e elementit duke përdorur, për shembull, as="p"
në komponent.
Përdorimi i useTranslation
hook-ut.
Kthen përkthime si një varg të thjeshtë. I dobishëm, për shembull, në tag-et 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 shërbimit translateEntries
.
Përkthe vargje në anën e serverit. Forco fotot tua 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 me makinë. Ndërsa përkthimet me makinë zakonisht kanë cilësi më të ulët në krahasim me përkthimet tona me AI, ato ofrojnë një përgjigje të shpejtë fillestare.
Njëkohësisht, ne nisim një proces përkthimi asinkron për të gjeneruar një përkthim të kualitetit të lartë, të avancuar me AI për vargun tuaj. Pasi përkthimi me AI të jetë gati, ai do të zëvendësojë përkthimin me makinë dhe do të dërgohet sa herë që kërkoni përkthime për vargjet tuaja.
Nëse keni përkthyer manualisht një varg, ato përkthime kanë përparësi dhe kthehen në vend të tyre.
Përdorimi i origjinave
Projektet TacoTranslate përmbajnë atë që ne e quajmë origjina. Mendoni për to 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ë ndaheni zinxhirët në kontejnerë 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 origins në nivelin e komponentit.
Për të arritur këtë, konsideroni përdorimin e disa ofruesve TacoTranslate brenda projektit tuaj.
Ju lutem vini re se i njëjti varg mund të marrë përkthime të ndryshme në origjina të ndryshme.
Në fund, mënyra se si ndan vargjet në origjina varet nga ju dhe nevojat tuaja. Megjithatë, vini re se pasja e shumë vargjeve brenda një origjine mund të rrisë kohën e ngarkimit.
Trajtimi i variablave
Gjithmonë duhet 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 shpallen 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
Në mënyrë të paracaktuar, komponenti Translate
mbështet dhe shfaq përmbajtje HTML. Megjithatë, ju mund të hiqni dorë nga kjo sjellje duke vendosur useDangerouslySetInnerHTML
në false
.
Çaktivizimi i renderimit HTML rekomandohet fuqimisht kur përkthen përmbajtje të pa besueshme, si për shembull përmbajtje e gjeneruar nga përdoruesit.
Të gjithë 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ë paraqitet si tekst i thjeshtë.