استخدم مساعدك المفضل للملخص واستخدم هذه الصفحة والموفر AI الذي تريده
بدءاً من الدمج مع خادم MCP Intlayer ، يمكن لمساعدك الذكي الاسترجاع من جميع المستندات مباشرة من ChatGPT ، DeepSeek ، Cursor ، VSCode ، إلخ.
عرض الوثائق الخاصة بالخادم MCPتمت ترجمة محتوى هذه الصفحة باستخدام الذكاء الاصطناعي.
اعرض آخر نسخة المحتوى الأصلي باللغة الإنكليزيةإذا كان لديك فكرة لتحسين هذه الوثيقة، فلا تتردد في المساهمة من خلال تقديم طلب سحب على GitHub.
رابط GitHub للتوثيقنسخ الـ Markdown من المستند إلى الحافظة
تكامل Next.js: توثيق هوك useLocale لحزمة next-intlayer
تقدم هذه القسم توثيقًا مفصلًا لهوك useLocale المصمم خصيصًا لتطبيقات Next.js ضمن مكتبة next-intlayer. تم تصميمه للتعامل مع تغييرات اللغة والتوجيه بكفاءة.
استيراد useLocale في Next.js
لاستخدام هوك useLocale في تطبيق Next.js الخاص بك، قم باستيراده كما هو موضح أدناه:
نسخ الكود إلى الحافظة
import { useLocale } from "next-intlayer"; // يستخدم لإدارة اللغات والتوجيه في Next.js
الاستخدام
إليك كيفية تنفيذ هوك useLocale داخل مكون Next.js:
نسخ الكود إلى الحافظة
"use client";import type { FC } from "react";import { Locales } from "intlayer";import { useLocale } from "next-intlayer";const LocaleSwitcher: FC = () => { const { locale, defaultLocale, availableLocales, setLocale } = useLocale(); return ( <div> <h1>اللغة الحالية: {locale}</h1> <p>اللغة الافتراضية: {defaultLocale}</p> <select value={locale} onChange={(e) => setLocale(e.target.value)}> {availableLocales.map((loc) => ( <option key={loc} value={loc}> {loc} </option> ))} </select> </div> );};
المعاملات وقيم الإرجاع
عند استدعاء الـ useLocale هوك، فإنه يعيد كائن يحتوي على الخصائص التالية:
- locale: اللغة الحالية كما تم تعيينها في سياق React.
- defaultLocale: اللغة الأساسية المعرفة في الإعدادات.
- availableLocales: قائمة بجميع اللغات المتاحة كما هو معرف في الإعدادات.
- setLocale: دالة لتغيير لغة التطبيق وتحديث عنوان URL وفقًا لذلك. تتولى قواعد البادئة، سواء بإضافة اللغة إلى المسار أو لا بناءً على الإعدادات. تستخدم useRouter من next/navigation لوظائف التنقل مثل push و refresh.
- pathWithoutLocale: خاصية محسوبة تُرجع المسار بدون اللغة. وهي مفيدة لمقارنة عناوين URL. على سبيل المثال، إذا كانت اللغة الحالية هي fr، وكان عنوان URL هو fr/my_path، فإن المسار بدون اللغة هو /my_path. تستخدم usePathname من next/navigation للحصول على المسار الحالي.
الخاتمة
تُعد دالة useLocale من مكتبة next-intlayer أداةً أساسية لإدارة اللغات في تطبيقات Next.js. فهي تقدم نهجًا متكاملاً لتكييف تطبيقك مع لغات متعددة من خلال التعامل بسلاسة مع تخزين اللغة، وإدارة الحالة، وتعديلات عناوين URL.
تاريخ الوثيقة
- 5.5.10 - 2025-06-29: بداية التاريخ