Sveltejs Academy · درس

معلمات المسارات الديناميكية: [id]

التقط مقاطع URL كمعلمات باستخدام صيغة الأقواس في أسماء المجلدات

الدرس 2 من 413 خطوة

معلمات المسارات الديناميكية: [id] درس مجاني في Sveltejs Academy على CoddyKit. هذا هو الدرس 2 من أصل 4. يمكنك قراءة الدرس كاملاً أدناه مجاناً — ثم تمرن عليه مباشرة في المتصفح باستخدام محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7. هذا الدرس جزء من مسار التعلم في Sveltejs Academy، وتقدمك يتزامن عبر الويب وتطبيق CoddyKit. تتضمن دورة Sveltejs Academy 4 دروس في المجموع.

أسماء المجلدات بين قوسين معقوفين

استخدم الأقواس المعقوفة في أسماء المجلدات للمقاطع الديناميكية.

src/routes/blog/[slug]/+page.svelte  -> /blog/:slug

الوصول إلى المعلمة

استخدم داخل الصفحة مخزن $page من $app/stores.

import { page } from "$app/stores";
<p>Slug: {$page.params.slug}</p>

الوصول من دالة Load

استخدم params.slug مباشرةً داخل دالة التحميل في +page.js.

export function load({ params }) { return { slug: params.slug }; }

معلمات متعددة

استخدم عدة أزواج من الأقواس للمسارات متعددة المقاطع.

src/routes/[lang]/[slug]/+page.svelte

التحقق من المعلمات

أرجع 404 من دالة التحميل إذا كانت المعلمة غير صالحة.

if (!isValid(params.slug)) error(404, "Not found");

المطابقات

أضف مطابقة في src/params لفرض تعبير نمطي على معلمة.

src/routes/blog/[slug=alpha]/+page.svelte

تعريف مطابقة

أنشئ src/params/alpha.js يصدّر دالة.

export function match(value) { return /^[a-z]+$/.test(value); }

تحسين SEO باستخدام Slugs

تكون Slugs عادةً معرّفات آمنة للاستخدام في URL. أنشئ Slugs من العناوين للحصول على عناوين URL واضحة.

دمج المسارات الثابتة والديناميكية

ضع المجلدات الثابتة إلى جانب المجلدات الديناميكية؛ وتكون الأولوية للثابتة عند التعارض.

أمان الأنواع

ينشئ SvelteKit أنواعًا للمعلمات الخاصة بكل مسار، ويمكن الوصول إليها في وسيطة دالة التحميل.

التصيير المسبق للمسارات الديناميكية

استخدم entries في +page.js لحصر القيم التي يجب تصييرها مسبقًا.

تحقق سريع

كيف تُعلَن المقاطع الديناميكية؟

مراجعة

استخدم مجلدات [param] للمقاطع الديناميكية. ويمكن الوصول إليها عبر params في دالة التحميل أو $page.params.

البدء مجانًا

تعلم HTML مع معلم ذكاء اصطناعي — مجانًا

اكتب وقم بتشغيل أكوادك الفعلية في المتصفح، واحصل على مساعدة فورية من معلم ذكاء اصطناعي متاح 24/7، واستمر من حيث توقفت على الويب أو في التطبيق.

الدورات
41
الدروس
163

الأسئلة الشائعة

هل درس «معلمات المسارات الديناميكية: [id]» مجاني؟

نعم — نص درس «معلمات المسارات الديناميكية: [id]» كامل متاح مجاناً هنا على الويب. لتمرينه بشكل تفاعلي (محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7) وفتح باقي دورة Sveltejs Academy، انتقل إلى CoddyKit PRO. تتضمن دورة Sveltejs Academy 4 دروس في المجموع.

ماذا ستتعلم في «معلمات المسارات الديناميكية: [id]»؟

التقط مقاطع URL كمعلمات باستخدام صيغة الأقواس في أسماء المجلدات تتمرن على Sveltejs Academy مع أكواد عملية تشغلها مباشرة في المتصفح، ومدرس ذكاء اصطناعي متاح 24/7 يجيب على أسئلتك أثناء عملك.

هل أحتاج إلى خبرة سابقة لأبدأ Sveltejs Academy؟

لا تُشترط خبرة سابقة. Sveltejs Academy على CoddyKit منظم للمبتدئين حتى المتقدمين، لذا يمكنك البدء من هنا أو من البداية والتقدم بسرعتك الخاصة. هذا هو الدرس 2 من أصل 4.

كم من الوقت يستغرق درس «معلمات المسارات الديناميكية: [id]»؟

معظم دروس CoddyKit تستغرق حوالي 5–10 دقائق. كل منها موجز وتفاعلي، لذا تحرز تقدماً مستمراً وتستأنف من حيث توقفت عبر الويب والتطبيق.

هل يمكنني كتابة وتشغيل أكواد في درس Sveltejs Academy هذا؟

نعم. كل درس في Sveltejs Academy يتضمن محرر أكواد مدمج، لذا تكتب وتشغل أكواداً حقيقية مباشرة في متصفحك وتحصل على تعليقات فورية من الذكاء الاصطناعي — بدون إعداد محلي.

جميع الدروس في هذه الدورة

  1. التوجيه القائم على الملفات باستخدام +page.svelte
  2. معلمات المسارات الديناميكية: [id]
  3. المعلمات الاختيارية ومعلمات Rest
  4. ملفات التخطيط: +layout.svelte
← العودة إلى Sveltejs Academy