TacoTranslate
/
HujjatlarNarxlar
 
  1. Kirish
  2. Boshlash
  3. Sozlash va konfiguratsiya
  4. TacoTranslate’dan foydalanish
  5. Server tomonlama chiqarish
  6. Murakkab foydalanish
  7. Eng yaxshi amaliyotlar
  8. Xatoliklarni boshqarish va nosozliklarni tuzatish
  9. Qoʻllab-quvvatlanadigan tillar

Eng yaxshi amaliyotlar

URL manzillarini o'zgaruvchilarga joylashtiring

URL manzillari yoki shunga o'xshash ma'lumotlarni o'z ichiga olgan satrlarni tarjima qilayotganda, bu URL manzillarni o'zgaruvchilarga joylab, keyin shablonlaringizda ularga murojaat qilish yaxshi amaliyot hisoblanadi.

<Translate
	string={`Click <a href="{{url}}">here</a>`}
	variables={{url: 'https://tacotranslate.com'}}
/>

ARIA yorliqlaridan foydalaning

Tugma kabi interaktiv elementlarning matnini tarjima qilayotganda, kirish imkoniyatini ta'minlash uchun ARIA yorliqlarini qo'shish muhim. ARIA yorliqlari ekran o'qigichlariga elementning vazifasi haqida tavsiflovchi ma'lumot berishda yordam beradi.

Masalan, agar kod blokidan matnni nusxalash imkonini beruvchi tugmangiz bo'lsa, aniq tavsif berish uchun aria-label atributidan foydalanishingiz mumkin:

<Translate
	aria-label={useTranslation('Copy to clipboard')}
	string="Copy"
/>

Bunda nimadir juda meta kabi tuyuladi.

Global manbalar massivi va bir nechta komponent manbalari

Bu naqsh faqat Next.js Pages Router ishlatilganda ishlaydi.

Katta ilovalar bilan ishlaganda, satrlarni va tarjimalarni bir nechta, kichikroq originlarga bo'lish foydalidir. Bu yondashuv paket (bundle) hajmini va uzatish vaqtini kamaytirishga yordam beradi, samarali va ko'lamlanadigan lokalizatsiyani ta'minlaydi.

Bu faqat mijoz tomonida render qilinganda sodda bo'lsa-da, server tomonida renderlash uchun tarjimalarni olishda originlarni boshqarish tezda murakkablashadi. Biroq, siz originlarni boshqarishni TacoTranslate klientining origins massivi yordamida avtomatlashtirishingiz mumkin.

Komponentlarimiz va sahifalarimizni alohida fayllarga ajratgan quyidagi misolni ko'rib chiqing.

components/pricing-table.tsx
import TacoTranslate, {Translate} from 'tacotranslate/react';
import tacoTranslate from '../tacotranslate-client';

// Set an origin name for this component
const origin = 'components/pricing-table';

// Push the origin into the origins array as this file is imported
tacoTranslate.origins.push(origin);

export default function PricingTable() {
	return (
		<TacoTranslate origin={origin}>
			<Translate string="Pricing table" />
			// ...
		</TacoTranslate>
	);
}
pages/pricing.tsx
import TacoTranslate, {Translate} from 'tacotranslate/react';
import getTacoTranslateStaticProps from 'tacotranslate/next/get-static-props';
import tacoTranslateClient from '../tacotranslate-client';
import PricingTable from '../components/pricing-table';

const origin = 'pages/pricing';
tacoTranslateClient.origins.push(origin);

export default function PricingPage() {
	return (
		<TacoTranslate origin={origin}>
			<Translate string="Pricing page" />
			<PricingTable />
		</TacoTranslate>
	);
}

// We will now fetch translations for all imported components and their origins automatically
export async function getStaticProps(context) {
	return getTacoTranslateStaticProps(context, {client: tacoTranslateClient});
}

Batafsil ma'lumot uchun server tomonida render qilish misollarimizni ko'ring getTacoTranslateStaticProps.

Xatoliklarni boshqarish va nosozliklarni tuzatish

Nattskiftetning mahsulotiNorvegiyada ishlab chiqarilgan