Kutumia TacoTranslate
Kutafsiri maandishi
Kwa sasa kuna njia tatu za kutafsiri strings: komponenti ya Translate, hook ya useTranslation, au zana ya translateEntries.
Kutumia komponenti ya Translate.
Inatoa tafsiri ndani ya kipengee cha span, na inaunga mkono kuonyesha HTML.
import {Translate} from 'tacotranslate/react';
function Page() {
return <Translate string="Hello, world!" />;
}Unaweza kubadilisha aina ya elementi kwa kutumia, kwa mfano, as="p" kwenye komponenti.
Kutumia hook ya useTranslation.
Inarudisha tafsiri kama kamba rahisi. Inafaa, kwa mfano, katika tagi 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 zana ya translateEntries.
Tafsiri maandishi upande wa seva. Boresha sana 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 maandishi yanavyotafsiriwa
Wakati maandishi yanapofika kwenye seva zetu, kwanza tunayayahakiki na kuya hifadhi, kisha mara moja turudishe tafsiri ya mashine. Ingawa tafsiri za mashine kwa ujumla zina ubora mdogo ikilinganishwa na tafsiri zetu za AI, zinatoa majibu ya awali kwa haraka.
Wakati huo huo, tunaanzisha kazi ya kutafsiri kwa njia isiyo ya papo hapo ili kuzalisha tafsiri ya AI ya ubora wa juu, ya kisasa kwa ajili ya maandishi yako. Mara tafsiri ya AI itakapokuwa tayari, itachukua nafasi ya tafsiri ya mashine na itatumwa kila utakapoomba tafsiri za maandishi yako.
Ikiwa umetafsiri msururu wa maandishi kwa mkono, tafsiri hizo zitapata kipaumbele na ndizo zitakazorejeshwa.
Kutumia vyanzo
Miradi ya TacoTranslate yanajumuisha kile tunachokiita mianzo. Zifikirie kama vituo vya kuingia, folda, au vikundi kwa ajili ya maandishi na tafsiri zako.
import {TacoTranslate} from 'tacotranslate/react';
function Menu() {
return (
<TacoTranslate origin="application-menu">
// ...
</TacoTranslate>
);
}Vyanzo hukuruhusu kutenganisha vifungu katika makundi yenye maana. Kwa mfano, unaweza kuwa na chanzo kimoja kwa ajili ya nyaraka na kingine kwa ukurasa wako wa masoko.
Ili kupata udhibiti wa kina zaidi, unaweza kuanzisha vyanzo kwa ngazi ya sehemu.
Ili kufanikisha hili, fikiria kutumia watoa huduma mbalimbali za TacoTranslate katika mradi wako.
Tafadhali kumbuka kwamba kamba ile ile ya maandishi inaweza kupata tafsiri tofauti katika vyanzo tofauti.
Hatimaye, jinsi unavyotenganisha strings ndani ya origins ni kwa uamuzi wako na mahitaji yako. Hata hivyo, kumbuka kwamba kuwa na strings nyingi ndani ya origin moja kunaweza kuongeza muda wa kupakia.
Kushughulikia vigezo
Unapaswa kila wakati kutumia vigezo kwa yaliyomo yanayobadilika, kama majina ya watumiaji, tarehe, anwani za barua pepe, na mengine.
Vigezo katika mfuatano wa herufi hutangazwa 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}});
}Kusimamia yaliyomo ya HTML
Kwa chaguo-msingi, komponenti ya Translate inaunga mkono na kuonyesha maudhui ya HTML. Hata hivyo, unaweza kuzima tabia hii kwa kuweka useDangerouslySetInnerHTML kuwa false.
Kuzima uonyeshaji wa HTML kunashauriwa sana wakati wa kutafsiri yaliyomo yasiyoaminika, kama yaliyotengenezwa na watumiaji.
Matokeo yote husafishwa kila wakati 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 hapo juu utaonyeshwa kama maandishi ya kawaida.