TacoTranslate භාවිතා කිරීම
පෙළ පරිවර්තනය
දැනට පෙළ පරිවර්තනය කිරීමට ක්‍රම තුනක් ඇත: Translate කොම්පොනන්ට්, useTranslation හූක්, හෝ translateEntries යූටිලිටි.
Translate කොම්පොනෙන්ට් භාවිතය.
පරිවර්තන span මූලද්‍රව්‍යයක් තුළ ප්‍රදර්ශනය වන අතර, HTML දෘශ්‍යකරණය සඳහා සහාය දක්වයි.
import {Translate} from 'tacotranslate/react';
function Page() {
return <Translate string="Hello, world!" />;
}උදාහරණයක් ලෙස, කොම්පොනන්ට් එකේ as="p" යොදාගෙන ඔබට element වර්ගය වෙනස් කළ හැක.
useTranslation hook එක භාවිත කිරීම.
පරිවර්තන සාමාන්‍ය පෙළක් ලෙස ලබාදේ. උදාහරණයක් ලෙස, 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>
);
}translateEntries උපකරණය භාවිතා කිරීම.
සේවාදායක පැත්තේ පෙළ පරිවර්තනය කරන්න. ඔබගේ 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)
};
}පෙළ පරිවර්තනය කෙරෙන්නේ කෙසේද?
පෙළ අපගේ සේවාදායකයන්ට ලඟා වන විට, අපි ප්‍රථමයෙන් ඒවා වලංගුකරණය කර ගබඩා කරන අතර, පසුව වහාම යන්ත්‍ර පරිවර්තනයක් ලබා දෙයි. යන්ත්‍ර පරිවර්තන සාමාන්‍යයෙන් අපගේ AI පරිවර්තනවලට වඩා ගුණාත්මකව අඩුවූවත්, ඒවා ඉක්මන් ආරම්භක ප්‍රතිචාරයක් සපයයි.
එකටම, අපි ඔබගේ පෙළ සඳහා උසස් තත්ත්වයේ, නවීනතම AI පරිවර්තනයක් නිර්මාණය කිරීමට අසමකාලීන පරිවර්තන රැකියාවක් ආරම්භ කරයි. AI පරිවර්තනය සූදානම් වූ විට, එය යන්ත්‍ර පරිවර්තනය ප්‍රතිස්ථාපනය කරනු ඇත සහ ඔබ ඔබගේ පෙළ සඳහා පරිවර්තන ඉල්ලූ ඕනෑම අවස්ථාවක එය යැවෙනු ඇත.
ඔබ පෙළක් අතින් පරිවර්තනය කර ඇත්නම්, ඒ පරිවර්තන ප්‍රමුඛත්වය ලබා ඒවාම ලබා දෙනු ලැබේ.
මූලාශ්‍ර භාවිතා කිරීම
TacoTranslate ව්‍යාපෘතිවලට අපි origins යන නාමයෙන් හැඳින්වෙන දේ ඇතුළත් වේ. ඒවා ඔබේ පෙළ සහ පරිවර්තන සඳහා ප්‍රවේශ ස්ථාන, ෆෝල්ඩර් හෝ කණ්ඩායම් ලෙස සිතන්න.
import {TacoTranslate} from 'tacotranslate/react';
function Menu() {
return (
<TacoTranslate origin="application-menu">
// ...
</TacoTranslate>
);
}Origins ඔබට ස්ට්‍රිං අර්ථවත් කන්ටේනර්වලට වෙන් කිරීමට ඉඩ සලසයි. උදාහරණයක් ලෙස, ඔබට ලේඛන සඳහා එක් origin එකක් සහ ඔබගේ වෙළඳ පිටුව සඳහා වෙනත් origin එකක් තිබිය හැක.
වඩා සුක්ෂ්ම පාලනයක් සඳහා, ඔබ කොම්පොනෙන්ට් මට්ටමේ origins පිහිටුවිය හැක.
මෙය සාර්ථක කිරීමට, ඔබේ ව්‍යාපෘතිය තුළ බහු TacoTranslate සපයන්නන් භාවිතා කිරීමට සලකා බලන්න.
කරුණාකර සලකන්න: එකම පෙළ විවිධ මූලාශ්‍රවලදී වෙනස් පරිවර්තන ලැබිය හැක.
අවසානයේ, ඔබ පේළි (strings) Origins වෙත කොපමණ ලෙස වෙන් කරන්නේදැයි තීරණය කිරීම ඔබට සහ ඔබගේ අවශ්‍යතාට අයත්ය. එහෙත්, එකම origin එකක් තුළ බොහෝ පේළි තිබීමෙන් ලෝඩිං කාලය (loading times) වැඩි විය හැක.
විචල්‍ය හසුරවීම
පරිශීලක නාම, දිනයන්, විද්‍යුත් තැපැල් ලිපින වැනි ගතික අන්තර්ගත සඳහා ඔබ සෑම විටම විචල්‍යයන් භාවිත කළ යුතුය.
පෙළවල ඇති වෙනස්කම් දෙගුණ කොටු භාවිතයෙන් ප්‍රකාශ කෙරේ, උදාහරණයක් ලෙස {{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}});
}HTML අන්තර්ගත කළමනාකරණය
පෙරනිමියෙන්, Translate කොම්පෝනන්ට් HTML අන්තර්ගතය සහය දක්වයි සහ රෙන්ඩර් කරයි. නමුත්, මෙම හැසිරීමෙන් ඉවත්වීමට useDangerouslySetInnerHTML false ලෙස සකස් කළ හැක.
පරිශීලක-ජනිත අන්තර්ගතය වැනි විශ්වාස කළ නොහැකි අන්තර්ගතයන් පරිවර්තනය කිරීමේදී HTML රෙන්ඩර කිරීම අක්‍රිය කිරීම දැඩි ලෙස නිර්දේශ කරනු ලැබේ.
සියලුම ප්‍රතිදාන රෙන්ඩර් කිරීමට පෙර සෑම විටම sanitize-html මඟින් ශුද්ධ කරනු ලැබේ.
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}
/>
);
}ඉහත උදාහරණය සාමාන්‍ය පෙළක් ලෙස රෙන්ඩර් කරනු ලැබේ.