العودة إلى الفهرس / أدوات التطوير
React View Transitions: اجعل كل حركة تعبر عن علاقة مكانية
حدد أنماط العناصر المشتركة وSuspense والقوائم والدخول والخروج والتنقل المناسبة.
المهارات
تحقق من إصدارات React/Next ودعم المتصفح واتبع مرجع التنفيذ بدءاً بالتدقيق. استخدم forward/back الموجه للتنقل الهرمي، وتلاشي بلا اتجاه للتبويبات الجانبية. صرح بالعناصر عبر `<ViewTransition>` وشغلها بواسطة `startTransition` أو `useDeferredValue` أو Suspense؛ لا تستدع `document.startViewTransition` بنفسك. ضع الحد قبل عقد DOM لدعم الدخول والخروج واستخدم CSS pseudo-elements. اختبر المتصفحات المطلوبة وحافظ على التراجع السلس.
الصلاحيات
المتطلبات السابقة
- لتنفيذ انتقالات الصفحات والعناصر المشتركة وإعادة ترتيب القوائم ودخول/خروج المكونات في React.
الصلاحيات
- قد تغير حدود المكونات ومحفزات Transition ورسوم CSS.
القيود
يعتمد ViewTransition على الإصدار والإطار؛ راع دعم المتصفحات ولا تستدع startViewTransition يدوياً.
المصدر الأصلي المثبت
- المستودع
- vercel-labs/agent-skills
- مسار الملف
- skills/react-view-transitions/SKILL.md
- الإيداع المثبت
063bee94c3f4df8453406c830b0a7df0f2860278- تاريخ فحص المصدر
- 2026-10-14 · تمت المراجعة مقابل المصدر الأصلي المثبت
مقاييس المستودع
تعكس هذه القيم المستودع الأصلي كله، ولا تمثل إعجابات أو شعبية مهارة أو دليل منفرد.
- النجوم
- لم يُجمع
- التفرعات
- لم يُجمع
- وقت الرصد
- لم يُجمع
لا تتوفر لقطة مقاييس بعد.
الترخيص: MIT
الأدوات المتوافقة
React ViewTransition API · CSS view-transition pseudo-elements · browser support matrix · existing route tests
الموضوع الرئيسي
انقل مساعد البرمجة من فهم السياق إلى التحقق من التغيير