TacoTranslate
/
Баримт бичигҮнэ ханш
 
  1. Танилцуулга
  2. Эхлэх
  3. Тохиргоо ба зохицуулалт
  4. TacoTranslate ашиглах
  5. Сервер талын рендеринг
  6. Дэвшилтэт хэрэглээ
  7. Шилдэг туршлагууд
  8. Алдааг удирдах ба алдааг олж засварлах
  9. Дэмжигдсэн хэлүүд

TacoTranslate ашиглах

Тэмдэгтүүдийг орчуулах

Одоогоор мөрүүдийг орчуулах гурван арга бий: Translate компонент, useTranslation хуук, эсвэл translateEntries хэрэгсэл.


Translate бүрэлдэхүүнийг ашиглах.
Орчуулгыг span элементийн дотор гаргаж, HTML дүрслэлтийг дэмждэг.

import {Translate} from 'tacotranslate/react';

function Page() {
	return <Translate string="Hello, world!" />;
}

Та элементийн төрлийг, жишээ нь, бүрдэл дээр as="p" гэж ашиглан өөрчилж болно.


useTranslation hook-г ашиглах.
Орчуулгыг энгийн мөр болгон буцаана. Жишээлбэл, meta tag-уудад ашиглагдана.

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-г маркетингийн хуудсандаа ашиглаж болно.

Илүү нарийн удирдлага хэрэгцээтэй бол компонент бүр дээр origin-уудыг тохируулж болно.

Үүнийг хэрэгжүүлэхийн тулд, таны төслийн хүрээнд олон TacoTranslate провайдер ашиглахыг бодоорой.

Анхаарна уу, ижил утгатай мөр өөр өөр эх сурвалжаас ялгаатай орчуулгуудыг авч болно.

Эцсийн эцэст, та тэмдэгт мөрүүдийг эх үүсвэрүүдэд хэрхэн хамтачлах нь таны болон таны хэрэгцээнд тулгуурлана. Гэсэн хэдий ч, нэг эх үүсвэрт олон тэмдэгт мөрүүд байх нь ачаалах хугацааг уртасгахыг анхаарна уу.

Хувьсагчийг удирдах

Таны динамик агуулгад, тухайлбал хэрэглэгчийн нэр, огноо, и-мэйл хаяг гэх мэт утгуудын хувьд үргэлж хувьсагчуудыг ашиглах хэрэгтэй.

Огнооны хувьсагчдыг хоёр хаалттайгаар, жишээ нь {{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}
		/>
	);
}

Дээр дурдсан жишээ нь энгийн текст болгон үзүүлэгдэх болно.

Сервер талын рендеринг

Nattskiftet-аас гаралтай бүтээгдэхүүнНорвегид бүтээгдсэн