لاسوند: غوره کړنې

غوره کړنې

Pashto

URLs په متغیرونو کې واچوئ

کله چې هغه متون ترجمه کوئ چې URLs یا ورته معلومات لري، غوره کړنه ګڼل کیږي چې دغه URLs په متغیرونو کې واچوئ او بیا یې په خپل قالبونو کې حواله کړئ.

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

کله چې د تڼیو په څېر د متقابل عناصرو متن وژباړو، دا مهمه ده چې د لاسرسي د یقیني کولو لپاره د ARIA لیبلونه شامل کړئ. د ARIA لیبلونه د سکرین ریډرونو سره مرسته کوي چې د عنصر د دندې په اړه تشریحي معلومات ورکړي.

د بېلګې په توګه، که تاسو داسې تڼۍ لرئ چې کاروونکو ته اجازه ورکوي چې د کوډ بلاک څخه متن کاپي کړي، تاسو کولی شئ د واضح تشریح لپاره د aria-label ځانګړتیا وکاروئ:

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

د دې په اړه یو څه ډیر میټا احساس کیږي.

د نړیوالو منبعو ارایه او څو برخې منبعې

دا نمونه یوازې هغه وخت کار کوي کله چې د Next.js Pages Router څخه کار واخیستل شي.

کله چې د لویو غوښتنلیکونو سره کار کوئ، دا ګټور دي چې تارونه او ژباړې په څو، کوچنیو سرچینو ووېشل شي. دا طریقه د بنډل اندازې او انتقال وختونه کموي، او د موثریت او د پراختیا وړ ځایي کولو ډاډ ورکوي.

که څه هم دا یوازې د کلایینټ اړخ کې د رینډر کولو پر مهال اسانېږي، کله چې د سرور اړخ رینډر کولو لپاره ژباړې ترلاسه کوئ نو د سرچینو مدیریت ژر پېچلی کېږي. په هر حال، تاسو کولی شئ د TacoTranslate کلایینټ origins آرایه کارولو سره د سرچینو مدیریت اتومات کړئ.

دا مثال وګورئ، چېرته چې موږ خپل برخې او صفحې په جلا فایلونو کې جلا کړي دي.

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});
}

زموږ د سرور-طرف رینډر کولو بیلګې وګورئ د getTacoTranslateStaticProps په اړه د نورو معلوماتو لپاره.

د تېروتنې مدیریت او ډیبګ کول

غوره کړنې

د ARIA لیبلونه وکاروئ

د نړیوالو منبعو ارایه او څو برخې منبعې