Kutumia TacoTranslate
Kutafsiri mistari
Hivi sasa kuna njia tatu za kutafsiri mistari: Kipengele cha Translate
, hook ya useTranslation
, au zana ya translateEntries
.
Kutumia sehemu ya Translate
Hutoa tafsiri ndani ya kipengele cha span
, na inaunga mkono utambulisho wa HTML.
import {Translate} from 'tacotranslate/react';
function Page() {
return <Translate string="Hello, world!" />;
}
Unaweza kubadilisha aina ya kipengee kwa kutumia, kwa mfano, as="p"
kwenye kipengee.
Kutumia useTranslation
hook.
Inarudisha tafsiri kama mfuatano wa maneno rahisi. Inafaa kutumika, kwa mfano, kwenye lebo za 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>
);
}
Kutumia chombo cha translateEntries
.
Tafsiri mfululizo wa maneno upande wa seva. Kuongeza nguvu picha zako za 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)
};
}
Jinsi vifungu vinavyotafsiriwa
Wakati nyuzi za maandishi zinapofikia seva zetu, kwanza tunazithibitisha na kuziweka, kisha mara moja turudishe tafsiri ya mashine. Ingawa tafsiri za mashine kwa ujumla ni za kiwango cha chini ikilinganishwa na tafsiri zetu za AI, hutoa majibu ya awali kwa haraka.
Kwa wakati mmoja, tunaanzisha kazi ya tafsiri isiyo ya papo hapo ili kuunda tafsiri ya AI ya hali ya juu, ya kisasa kwa mnyororo wako. Mara tafsiri ya AI itakapotengenezwa, itachukua nafasi ya tafsiri ya mashine na itatumwa kila utakapotaka tafsiri za minyororo yako.
Ikiwa umefasiri neno moja kwa mkono, tafsiri hizo zinaipa kipaumbele na hurudishiwa badala yake.
Kutumia asili
Miradi ya TacoTranslate ina kile tunachokiita asili. Fikiria kama maeneo ya kuingilia, folda, au vikundi vya misemo na tafsiri zako.
import {TacoTranslate} from 'tacotranslate/react';
function Menu() {
return (
<TacoTranslate origin="application-menu">
// ...
</TacoTranslate>
);
}
Origins hukuruhusu kutenganisha mistari katika makontena yenye maana. Kwa mfano, unaweza kuwa na chanzo kimoja kwa ajili ya nyaraka na kingine kwa ajili ya ukurasa wako wa masoko.
Ili kupata udhibiti wa kina zaidi, unaweza kuweka origins kwenye kiwango cha sehemu.
Ili kufanikisha hili, fikiria kutumia watoa huduma wengi wa TacoTranslate ndani ya mradi wako.
Tafadhali kumbuka kuwa kamba ile ile inaweza kupokea tafsiri tofauti katika asili tofauti.
Mwishowe, jinsi unavyogawanya mistari kuwa asili ni kwako na mahitaji yako. Hata hivyo, kumbuka kwamba kuwa na mistari mingi ndani ya asili moja kunaweza kuongeza muda wa kupakia.
Kushughulikia vigezo
Unapaswa kutumia variables daima kwa maudhui yanayobadilika, kama majina ya watumiaji, tarehe, anwani za barua pepe, na zaidi.
Mabadiliko katika mfululizo huashirwaji kwa kutumia mabano mawili, kama {{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}});
}
Kudhibiti maudhui ya HTML
Kwa chaguo-msingi, sehemu ya Translate
inaunga mkono na kuonyesha yaliyomo ya HTML. Hata hivyo, unaweza kujitoa kwenye tabia hii kwa kuweka useDangerouslySetInnerHTML
kuwa false
.
Kupiga marufuku uonyeshaji wa HTML kunapendekezwa sana wakati wa kutafsiri maudhui yasiyotegemewa, kama vile yaliyotengenezwa na watumiaji.
Matokeo yote huwa yanakasishwa kwa usafi kwa kutumia sanitize-html kabla ya kuonyeshwa.
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}
/>
);
}
Mfano ulio hapo juu utaonyeshwa kama maandishi ya kawaida.