උන්නත භාවිතය
වමෙන් දකුණට භාෂා සැලැස්වීම
TacoTranslate ඔබේ React යෙදුම්වලදී අරාබි සහ හෙබ්රු වැනි දකුණු සිට වමට (RTL) භාෂා සහාය දැක්වීම පහසු කරයි. RTL භාෂා නිවැරදිව සැලසීමෙන්, දකුණු සිට වමට කියවන පරිශීලකයින් සඳහා ඔබේ අන්තර්ගතය නිවැරදිව ප්රදර්ශනය වන බවට සහනයක් ලැබේ.
import {useTacoTranslate} from 'tacotranslate/react';
function Document() {
const {locale, isRightToLeft} = useTacoTranslate();
return (
<html lang={locale} dir={isRightToLeft ? 'rtl' : 'ltr'}>
<body>
// ...
</body>
</html>
);
}
ඔබට දැනට භාවිතා කරමින් තිබෙන භාෂාව Reactඅතිරේකව පරීක්ෂා කිරීම සඳහා සැපයූ isRightToLeftLocaleCode
ක්රියාවලියද භාවිතා කළ හැක.
import {isRightToLeftLocaleCode} from 'tacotranslate';
function foo(locale = 'es') {
const direction = isRightToLeftLocaleCode(locale) ? 'rtl' : 'ltr';
// ...
}
පරිවර්තනය අක්රිය කිරීම
ස්ත්රිංගයක් තුළ ස්පැසිෆික් කොටස් පරිවර්තනය අක්රීය කිරීමට හෝ කිසියම් කොටස් මූලික ආකාරයෙන් පවතින්නා ලෙස තහවුරු කිරීමට, ඔබට ත්රිත්ව වර්ග ලකුණු () භාවිතා කළ හැක. මෙම විශේෂාංගය නම්, තාක්ෂණික පද, හෝ පරිවර්තනය කිරීමට නොහැකි වෙනත් අන්තර්ගතය ආදී මූලික ආකාරය පවත්වා ගැනීමට ප්රයෝජනවත් වේ.
import {Translate} from 'tacotranslate/react';
function Component() {
return (
<Translate string="Hello, [[[TacoTranslate]]]!" />
);
}
මෙම උදාහරණයේ, “TacoTranslate” වචනය පරිවර්තනයේදී වෙනස් නොවනු ඇත.
බහු TacoTranslate සපයන්නන්
අපි ඔබේ යෙදුම තුළ බහුවරණ TacoTranslate
සැපයුම්කරුවන් භාවිතා කිරීමට දැඩි ලෙස උත්තේජනය කරමු. මෙය ඔබේ පරිවර්තන සහ ස්ට්රිිං වගුව මූලාශ්ර විවිධව, උදාහරණ ලෙස හිසට, පාදයට හෝ විශේෂ කොටස් වෙත සංවිධානය කිරීමට ප්රයෝජනවත් වේ.
ඔබට මෙහි ඇති මූලාශ්ර භාවිතා කිරීම පිළිබඳ වැඩිදුර කියවිය හැක.
TacoTranslate
සපයන්නන්ට යම් පියාපෙළ සපයන්නාගෙන් සැකසුම් උරුම වේ, එනිසා ඔබට වෙනත් සැකසුම් නැවත නැවත කරන්න අවශ්ය නොවේ.
import createTacoTranslateClient from 'tacotranslate';
import {TacoTranslate} from 'tacotranslate/react';
const tacoTranslateClient = createTacoTranslateClient({apiKey: 'YOUR_API_KEY'});
function Header() {
return (
<TacoTranslate origin="header">
// ...
</TacoTranslate>
);
}
function Menu() {
return (
<TacoTranslate origin="menu">
// ...
</TacoTranslate>
);
}
export default function App() {
return (
<TacoTranslate client={tacoTranslateClient} origin="page" locale="es">
<Header />
<Menu />
</TacoTranslate>
);
}
මූලාශ්ර හෝ භාෂා ප්රදේශය ප්රතිස්ථාපනය කිරීම
බහුවිධ TacoTranslate
සැපයුම්කරුවන් භාවිතා කිරීමට අමතරව, ඔබට Translate
කොම්පොනන්ට් සහ useTranslation
හුක් මට්ටම් මත මූලස්ථානය සහ භාෂා කේතය දෙකම අතිරේක කරන්න පුළුවන්.
import {Translate, useTranslation} from 'tacotranslate/react';
function Greeting() {
const spanishHello = useTranslation('Hello!', {locale: 'es'});
return (
<>
{spanishHello}
<Translate string="What’s up?" origin="greeting" />
</>
);
}
පූරණය හසුරවීම
පාරිභෝගික පාර්ශ්වයේ භාෂා වෙනස් කිරීමේදී, පරිවර්තන ලබා ගැනීම පරිශීලකයාගේ සම්බන්ධතාවයට අනුව තත්පර කිහිපයක් ගැනීමට ඉඩ ඇත. මාරු කිරීමේදී දෘශ්ය ප්රතිචාර ලබා දීමෙනුයි පරිශීලක අත්දැකීම වර්ධනය කිරීමට ඔබට loading indicator එකක් ප්රදර්ශනය කළ හැකිය.
import {useTacoTranslate} from 'tacotranslate/react';
function Component() {
const {isLoading} = useTacoTranslate();
return (
isLoading ? 'Translations are loading...' : null
);
}
බහුවචනය කිරීම
වචන බහුවචන කිරීම හසුරවමින් සහ විවිධ භාෂාවල ගණන් අනුව ලේබල් නිවැරදිව ප්රදර්ශනය කිරීම සඳහා, මෙය හොඳම අභ්යාසයක් ලෙස සැලකේ:
import {Translate, useLocale} from 'tacotranslate/react';
function PhotoCount() {
const locale = useLocale();
const count = 1;
return count === 0 ? (
<Translate string="You have no photos." />
) : count === 1 ? (
<Translate string="You have 1 photo." />
) : (
<Translate
string="You have {{count}} photos."
variables={{count: count.toLocaleString(locale)}}
/>
);
}
බහුවර්ණ භාෂා
එකම යෙදුම තුළ බහු භාෂා එකවර සහාය දීමට, ඔබට පහත පරිදි විවිධ locale
අගයන් සමඟ බහු TacoTranslate සැපයුම්කරුවන් භාවිතා කළ හැක:
ඔබට locale
කොම්පොනන්ට් හෝ හුක් මට්ටමෙන්ද අසුකරගත හැකිය.
import createTacoTranslateClient from 'tacotranslate';
import {TacoTranslate, Translate} from 'tacotranslate/react';
const tacoTranslateClient = createTacoTranslateClient({apiKey: 'YOUR_API_KEY'});
function Spanish() {
return (
<TacoTranslate locale="es">
<Translate string="Hello, world in Spanish!" />
</TacoTranslate>
);
}
function Norwegian() {
return (
<TacoTranslate locale="no">
<Translate string="Hello, world in Norwegian!" />
</TacoTranslate>
);
}
export default function App() {
return (
<TacoTranslate client={tacoTranslateClient} origin="page" locale="es">
<Spanish />
<Norwegian />
</TacoTranslate>
);
}
පරිවර්තන හැඳුනුම් අංක භාවිතය
ඔබට Translate
කොම්පොනෙන්ට්ට id
එකක් එක් කළ හැකි අතර එය එකම දිගුව සඳහා විවිධ පරිවර්තන හෝ අර්ථයන් හසුරවීමට උපකාරී වේ. මේවා විශේෂයෙන්ම ප්රයෝජනවත් වේ, එකම පාඨය සන්දර්භය පදනම්ව වෙනස් පරිවර්තන අවශ්ය වන විට. විවිධ අංකයන් පවරා එකම දිගුවේ සෑම අවස්ථාවක්ම එහි විශේෂිත අර්ථය අනුව නිවැරදිව පරිවර්තනය වීම ඔබට විශ්වාසවන්ත කරගත හැක.
import {Translate} from 'tacotranslate/react';
function Header() {
return (
<Translate id="header" string="Login" />
);
}
function Footer() {
return (
<Translate id="footer" string="Login" />
);
}
උදාහරණයක් ලෙස, හිස කොටසේ පිවිසුම “Iniciar sesión” ලෙස පරිවර්තනය විය හැකි අතර, පීදුරු පිවිසුම “Acceder” ලෙස ස්පැනිෂ් භාෂාවෙන් පරිවර්තනය විය හැකිය.