Home React Reference props

props

function

Props are read-only inputs to components. Use destructuring for cleaner syntax. Default values prevent undefined errors.

Syntax

function Component({ prop1, prop2 = defaultValue }) {}

Example

javascript

function UserCard({ name, email, role = 'User', avatar }) {
    return (
        <div className="card">
            <img src={avatar} alt={name} />
            <h2>{name}</h2>
            <p>{email}</p>
            <span className="badge">{role}</span>
        </div>
    );
}

// Usage
<UserCard
    name="Alice"
    email="alice@example.com"
    role="Admin"
    avatar="/avatars/alice.jpg"
/>

useReducer()

children prop