Përdorimi i TacoTranslate
Përkthimi i vargjeve
Aktualisht ka tre mënyra për të përkthyer vargjet: Komponenti Translate
, hook-u useTranslation
ose utiliteti translateEntries
.
Përdorimi i komponentit Translate
Shfaq përkthime brenda një elementi span
, dhe mbështet renditjen e HTML.
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.
Kthen përkthime si një varg i 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 utilitetit translateEntries
.
Përkthe vargjet në anën e serverit. Forco imazhet 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ë te serverët 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 krahasuar me përkthimet tona me AI, ato ofrojnë një përgjigje të shpejtë fillestare.
Njëkohësisht, ne fillojmë një detyrë përkthimi asinkron për të gjeneruar një përkthim AI me cilësi të lartë dhe teknologji të fundit për vargun tuaj. Pasi përkthimi AI të jetë gati, ai do të zëvendësojë përkthimin automatik 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ë tjerëve.
Përdorimi i origjinave
Projekte TacoTranslate përmbajnë atë që ne e quajmë origjina. Mendoji si pika hyrëse, dosje, ose grupe për tekstet dhe përkthimet tua.
import {TacoTranslate} from 'tacotranslate/react';
function Menu() {
return (
<TacoTranslate origin="application-menu">
// ...
</TacoTranslate>
);
}
Origjinat ju lejojnë të ndani tekstet në kuti me kuptim të veçantë. 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ë vendosni origins në nivelin e komponentit.
Për ta arritur këtë, merr parasysh përdorimin e disa furnizuesve TacoTranslate brenda projektit tënd.
Ju lutemi vini re se e njëjta varg mund të marrë përkthime të ndryshme në origjina të ndryshme.
Në fund, se si i 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.
Menaxhimi i variablave
Gjithmonë duhet të përdorni variabla për përmbajtje dinamike, si p.sh. emrat e përdoruesve, datat, adresat e email-it dhe më shumë.
Variablat në vargje shfaqen 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 të shkëputeni nga ky sjellje duke vendosur useDangerouslySetInnerHTML
në false
.
Çaktivizimi i renditjes së HTML-it rekomandohet fuqishëm kur përkthen përmbajtje të paverifikuar, si përmbajtja e gjeneruar nga përdoruesit.
Gjithë përmbajtja gjithmonë pastrohet me sanitize-html para se të shfaqet.
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ë.