Group Related State Togetherتجميع الحالات المتلازمة معاً
صمّم هياكل حالة متينة في React عبر تجميع البيانات المترابطة ومنع الرايات المتناقضة وحساب القيم المشتقة أثناء التصيير وتخزين المعرّفات دون نسخ الخصائص.
3 صفوف تعليمية
ReactJS
0 مشاهدة
شرح صفوف ومحتوى الفقرة
الصف 1
شرح توضيحي
إن جودة تصميم هيكل الحالة هي الفارق الحقيقي بين مكون سهل التطوير ومكون تتوالد فيه أخطاء عدم التزامن. تنص القاعدة الهندسية الأولى في توثيق React على تجميع الحالات المتلازمة؛ فإذا كان متغيران يتحدثان معاً دائماً في الحدث نفسه، فالأصوب دمجهما في كائن واحد.
فمثلاً، تخزين إحداثيات المؤشر في { x: 0, y: 0 } أو أبعاد البطاقة في { width, height } يضمن تحديثهما كوحدة متماسكة، بينما نبقي المتغيرات المستقلة تماماً منفصلة لسهولة إدارتها.
الصف 2
كود برمجي
</>HTML
function BannerSizer() {
const [size, setSize] = useState({ w: 640, h: 360 });
function applyPreset(w, h) {
setSize({ w, h });
}
return <p>{size.w} x {size.h} px</p>;
}