ಸುಧಾರಿತ ಬಳಕೆ
ಬಲದಿಂದ ಎಡಕ್ಕೆ ಓದುವ ಭಾಷೆಗಳ ನಿರ್ವಹಣೆ
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>
);
}ನೀವು ಒದಗಿಸಲಾದ isRightToLeftLocaleCode ಕಾರ್ಯವನ್ನು React ಹೊರಗೆ ಪ್ರಸ್ತುತ ಭಾಷೆಯನ್ನು ಪರಿಶೀಲಿಸಲು ಕೂಡ ಬಳಸಬಹುದು.
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 ಹಾಕ್ ಮಟ್ಟಗಳಲ್ಲಿ origin ಮತ್ತು locale ಎರಡನ್ನೂ override ಮಾಡಬಹುದು.
import {Translate, useTranslation} from 'tacotranslate/react';
function Greeting() {
const spanishHello = useTranslation('Hello!', {locale: 'es'});
return (
<>
{spanishHello}
<Translate string="What’s up?" origin="greeting" />
</>
);
}ಲೋಡಿಂಗ್ ಅನ್ನು ನಿರ್ವಹಿಸುವುದು
ಕ್ಲೈಂಟ್-ಸೈಡ್ನಲ್ಲಿ ಭಾಷೆಗಳನ್ನು ಬದಲಿಸುವಾಗ, ಅನುವಾದಗಳನ್ನು ಪಡೆದುಕೊಳ್ಳಲು ಬಳಕೆದಾರರ ಸಂಪರ್ಕದ ಅವಲಂಬನೆಯಿಂದ ಕೆಲವು ಕ್ಷಣಗಳು ಬೇಕಾದಿರಬಹುದು. ಬದಲಾವಣೆಯ ಸಮಯದಲ್ಲಿ ದೃಶ್ಯಾತ್ಮಕ ಪ್ರತಿಕ್ರಿಯೆ ನೀಡುವುದರ ಮೂಲಕ ಬಳಕೆದಾರ ಅನುಭವವನ್ನು ಸುಧಾರಿಸಲು ನೀವು ಲೋಡಿಂಗ್ ಸೂಚಕವನ್ನು ಪ್ರದರ್ಶಿಸಬಹುದು.
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)}}
/>
);
}ಬಹುಭಾಷೆಗಳು
ಒಂದು ಅಪ್ಲಿಕೇಶನ್ನಲ್ಲಿ ಒಂದೇ ಸಮಯದಲ್ಲಿ ಹಲವಾರು ಭಾಷೆಗಳನ್ನು ಬೆಂಬಲಿಸಲು, ನೀವು ಹಲವಾರು TacoTranslate ಪ್ರೊವೈಡರ್ಗಳನ್ನು ಬಳಸಬಹುದು ಮತ್ತು ವಿಭಿನ್ನ locale ಮೌಲ್ಯಗಳೊಂದಿಗೆ ಕೆಳಗಿನಂತೆ ತೋರಿಸಲಾಗಿದೆ:
ನೀವು 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>
);
}ಅನುವಾದ ಐಡಿಗಳ ಬಳಕೆ
ನೀವು id ಅನ್ನು Translate ಕಂಪೋನಂಟ್ಗೆ ಸೇರಿಸಬಹುದು, ಇದು ಒಂದೇ ಸ್ಟ್ರಿಂಗ್ಗೆ ವಿಭಿನ್ನ ಅನುವಾದಗಳು ಅಥವಾ ಅರ್ಥಗಳನ್ನು ನಿರ್ವಹಿಸಲು ಸಹಾಯ ಮಾಡುತ್ತದೆ. ಒಂದೇ ಪಠ್ಯವು ಸಂದರ್ಭಾನುಸಾರ ವಿಭಿನ್ನ ಅನುವಾದಗಳನ್ನು ಅಗತ್ಯವಿದ್ದಾಗ ಇದು ವಿಶೇಷವಾಗಿ ಉಪಯುಕ್ತವಾಗಿದೆ. ಅನನ್ಯ ಐಡಿಗಳನ್ನು ನಿಯೋಜಿಸುವ ಮೂಲಕ, ಪ್ರತಿಯೊಂದು ಸ್ಟ್ರಿಂಗ್ ಉದಾಹರಣೆ ಅದರ ನಿರ್ದಿಷ್ಟ ಅರ್ಥಕ್ಕೆ ಅನುಗುಣವಾಗಿ ನಿಖರವಾಗಿ ಅನುವಾದವಾಗುತ್ತದೆ ಎಂಬುದನ್ನು ನೀವು ಖಚಿತಪಡಿಸಿಕೊಳ್ಳಬಹುದು.
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” ಎಂದು ಸ್ಪ್ಯಾನಿಷ್ನಲ್ಲಿ ಅನುವಾದಿಸಬಹುದು.