استقلال ذاكرة كل نسخة مكون | ذاكرة المكون عبر useState وقواعد الخطافات

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

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

تتميز الحالة بأنها محلية ومعزولة تماماً لكل نسخة مكون معروضة على الشاشة. فإذا عرضت المكون <SeatCounter /> مرتين جنباً إلى جنب داخل صفحة واحدة، تحجز React ذاكرة منفصلة تماماً لكل نسخة بحيث لا يؤثر تغيير الأولى إطلاقاً على الثانية.

الصف 2 كود برمجي

HTML

import { useState } from 'react';

function VoteWidget({ track }) {
  const [votes, setVotes] = useState(0);
  return (
    <button onClick={() => setVotes(votes + 1)}>
      {track}: {votes} votes
    </button>
  );
}

جرّب بنفسك

الصف 3 ملاحظة هامة

Isolated Per Instance Memory استقلال ذاكرة كل نسخة مكون

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

جميع فقرات هذا الدرس (ذاكرة المكون عبر useState وقواعد الخطافات)