פקדים פונקציונאליים

פקדים שלא מנהלים State נקראים פקדים פונקציונאליים. כל תפקידם להציג מידע שמגיע אליהם מבחוץ בתור Properties. בריאקט יש כתיב פשוט לפקדים אלו בתור פונקציות. כך זה נראה.

1. הגדרת פקד פונקציונאלי

פקד פונקציונאלי הוא בסך הכל פונקציה שזהה לפונקציית render שהיינו כותבים בגוף הפקד. הנה דוגמא פשוטה לאחד כזה:

function Hello(props) {
  return (<p>
        Hello: {props.name}
  </p>);
}

2. הגדרת Prop Types

לפקד פונקציונאלי אין State אבל הוא בהחלט ניתן (ואף רצוי) להגדיר Prop Types עבור וידוא הקלטים שמקבל. אנו מגדירים Prop Types בפקד פונקציונאלי באמצעות הגדרת מאפיינים על הפונקציה באופן הבא:

function Hello(props) {
  return <p>
    Hello: {props.name}
  </p>
}

Hello.propTypes = { name: React.PropTypes.string };
Hello.defaultProps = { name: "Guest" };

3. תקציר הפקודות שהוצגו בפרק

קוד הפקד והתוצאה:


קוד הפקד והתוצאה: