محتويات الدورة

Svelte / المتوسط: مسارات Kit وسياسة بيانات الخادم / الدرس 12

التنقل وحالة URL والإبطال المستهدف

مثل حالة العرض القابلة للمشاركة في URL وأعد عقد البيانات المعني دون افتراض مسح مخبأ عالمي.

وقت القراءة التقريبي: 4 دقيقةتاريخ مراجعة المحتوى
في هذه الصفحة

أهداف الدرس

  • اشرح التحميل المسبق وgoto واعتمادات load المتتبعة.
  • افصل حالة الصفحة الحالية والإبطال وحداثة المصدر.

يصف URL المشترك العرض المقصود

يناسب URL المرشح والترتيب والمؤشر وتبقى البؤرة والقائمة محليتين. قد تفاجئ نسخة مرشح تخالف العنوان عند التحميل والرجوع. تحقق من المسار والاستعلام والتكرار قبل المصدر. المؤشر حد متابعة لا لقطة ثابتة بالضرورة، وأبعد الجلسة عن العنوان والسجل. اختر إضافة التاريخ أوتبديله واحفظ الرابط المتاح. لا يجعل ترميز القيمة قبولها في المجال؛ فقد يكون مرشح صحيح الصياغة غير مسموح لهذا المستخدم أوينتج استعلاماً أكثر كلفة مما يقبله عقد الصفحة.

استهدف الاعتماد الذي تعلنه load فعلياً

يستدعي الجزء invalidate بتسمية الاعتماد نفسها؛ API متصفح لا مسح كل مخبأ خارجي. تعلن load الاعتماد أوتقرأه وفق التتبع. قد تعيد قديماً من مخبأ المصدر ولا يعاد غير المعني أصلاً. لم يشغل الاستيراد أوcallback. استخدم invalidateAll إذا قصدت الأوسع بالصفحة وراجع إبطال التحسين منفصلًا. ينبغي أن يعرف من يضغط زر التحديث هل بدأ انتظاراً وهل فشل المصدر، لا أن يظل الزر بلا نتيجة واضحة لأن الاستدعاء التقني حدث بينما بقيت البيانات كما هي.

svelte إبطال load مستهدف توضيحي
<script>
  import { invalidate } from "$app/navigation";
  async function refreshCard() {
    await invalidate("app:course-card");
  }
</script>
<button onclick={refreshCard}>Refresh course card</button>

الاعتماد المطابق والمتصفح شرطان، ولم تنفذ إعادة load أوعملية مخبأ.

قد يشغل المسبق عملاً قبل التنقل المرئي

قد يجهز الرابط البيانات قبل قرار الانتقال؛ أبق load بلا أثر دائم وقيد المصدر. استخدم وجهة معتمدة مع goto والرابط ولا تمرر next عشوائياً. قد تحفظ Kit المثيل وتحدث data فلا تتوقع تهيئة كل مرة. تخدم snapshot أوالحالة السطحية حاجة محددة لا تخزيناً دائماً أوتفويضاً. افحص النسخة ولا تفترض أعماراً متطابقة. قد يؤدي استدعاء عرض إلى بحث مكلف أثناء hover، ولهذا يجب أن يتوافق قرار تفعيل المسبق مع الموارد والخصوصية لا أن يكون مجرد تحسين بصري بلا مراجعة.

حدد معنى واحداً لمرشح مكرر

يقبل المحلل حالة واحدة أوالافتراض ويرفض التكرار بـURLSearchParams بلا طلب. قد تسمح API بقائمة لكن يتفق المستهلك لا يأخذ الأول أوالأخير صامتاً. يثبت التحقق المعنى لا إذن المؤرشف. تجمع load المرشح بالهوية وتصفح محدود. لا يختبر التتبع أوgoto أوالإبطال، بل يحتاج الباقي تطبيقاً ومتصفحاً. يساعد كشف التكرار قبل المصدر في منع اختلاف طبقتين إحداهما تحلل قيمة للعقد والأخرى تستخدم قيمة أخرى في الاستعلام أوفي مفتاح مخبأ التمثيل المعروض.

javascript عقد مرشح URL محلي كامل
function stateFilter(query){
  const values=new URLSearchParams(query).getAll("state");
  if(values.length>1)throw new Error("DUPLICATE_STATE");
  const state=values[0]??"published";
  if(!["published","archived"].includes(state))throw new Error("INVALID_STATE");return state;
}
console.assert(stateFilter("")==="published");
console.assert(stateFilter("state=archived")==="archived");
let rejected=false;try{stateFilter("state=published&state=archived");}catch{rejected=true;}console.assert(rejected);

يقبل الافتراض والمسموح ويرفض التكرار دون تنقل أوسياسة مصدر.

اختبر البيانات الحالية والمسودة المحفوظة وتبدل الهوية

تحقق من المباشر والمسبق والرجوع والإبطال ونتيجة النموذج بالإعداد نفسه. حدث data مع قاعدة المسودة المقصودة، وارفض رد الهوية القديمة ومخبأها. لا يثبت نجاح وعد invalidate كتابة أوحداثة عامة. يشغل المقرر المحلل فقط دون خطاف أومسبق أوتتبع أوتاريخ أومخبأ. صرح بالقيد واستعمل هويات اصطناعية مأذونة لا حسابات حية خاصة. يفصل ذلك بين اكتمال استدعاء API وبين نجاح المهمة التي يريدها المستخدم، كأن يرى اسماً جديداً بعد كتابة تغير أيضاً موضع المقرر في القائمة.

الأخطاء الشائعة وإصلاحها

لا تعيد عملية التحديث عملاً معنيّاً

لماذا يحدث؟
لم يطابق الهدف اعتماد load متتبعاً أومعلناً.
كيف تصلحه؟
وافق إعلان الاعتماد ومفردات الإبطال.
كيف تتجنب تكراره؟
أكد إعادة load الفعلية ونسخة المصدر المعروضة.

يختلف URL والمرشح المحلي بعد الرجوع

لماذا يحدث؟
تنافست نسخ حالة قابلة للمشاركة دون عقد تزامن.
كيف تصلحه؟
اجعل URL المتحقق مصدر القصد أوعرف تسوية صريحة.
كيف تتجنب تكراره؟
اختبر المشاركة والتحميل وانتقالات التاريخ.

تنفذ عملية مسبقة كتابة قبل النقرة

لماذا يحدث؟
حمل التصيير أوالتحميل أثر عمل غير قابل للتراجع.
كيف تصلحه؟
انقل الكتابة لفعل أومدخل صريح متحقق ومفوض.
كيف تتجنب تكراره؟
اختبر المسبق مستقلاً عن الإرسال المؤكد.

اختبر فهمك

1. هل تضمن invalidate حداثة كل مصدر؟

اعرض الحل المشروح

لا. تستهدف اعتماد load الموثق وقد يعيد الخارج قديماً أوتبقى تمثيلات أخرى دون إعادة. سم الطبقة وافحص نسختها وأصلح إبطال المصدر مستقلاً حيث يلزم.

2. لماذا يبقى عمل load المسبق بلا أثر جانبي؟

اعرض الحل المشروح

قد ينفذه الإطار قبل اختيار الوجهة فتحدث كتابة بمرور أوبظهور وتتكرر دون قصد صريح. اجعل load لاشتقاق البيانات المسموحة واستخدم كتابة منفصلة بسلطة وإعادة.

أهم ما تعلمته

  • تحتاج حالة URL والإبطال عقدين صريحين متطابقين.
  • يغير المسبق وحفظ المكونات التوقيت لا سلطة المجال.

المراجع الرسمية