انتقل إلى محتوى الدرس
ابدأ رحلتك
فقرة فرعية #2 من درس: التنقل البرمجي وصفحة عدم العثور والمسارات المحمية

History Replace and Back Steps خيار replace والرجوع بالسجل

وجّه المستخدم برمجياً بعد إرسال النماذج بخطاف useNavigate وخيار replace، وأنشئ صفحة 404 وحارس المسارات المحمية ProtectedRoute مع تطبيق التحقق الأمني الإلزامي بالخادم.
3 صفوف تعليمية
ReactJS
1 مشاهدة

شرح صفوف ومحتوى الفقرة

الصف 1 شرح توضيحي

تضيف دالة navigate("/dashboard") افتراضياً مدخلاً جديداً فوق سجل التصفح. لكن بعد إتمام تسجيل الدخول أو الدفع بنجاح، لا يصح أن يعيد زر الرجوع المستخدم إلى شاشة الدخول المنتهية! لذلك نمرر الخيار { replace: true } لاستبدال مدخل الدخول في السجل، كما يمكن تمرير عدد نسبي مثل navigate(-1) للعودة خطوة واحدة للخلف.

الصف 2 كود برمجي
HTML 
function CheckoutConfirm() {
  const navigate = useNavigate();
  const finish = () =>
    navigate('/done', { replace: true });
  return (
    <div>
      <button onClick={() => navigate(-1)}>Back</button>
      <button onClick={finish}>Pay Now</button>
    </div>
  );
}
جرّب بنفسك
الصف 3 معاينة حية

جميع فقرات هذا الدرس (التنقل البرمجي وصفحة عدم العثور والمسارات المحمية)