| Criteria | Props | State |
|---|---|---|
| What is it? | Data from parent component | Internal data of the component |
| Who manages it? | Managed by parent | Managed by itself |
| Mutable? | ❌ No (read-only) | ✅ Yes, via setState or useState |
| Accessible inside component? | ✅ Yes | ✅ es |
| Purpose | Configure & pass data to component | Track dynamic internal state |
function Welcome(props) {
return <h1>Hello, {props.name}</h1>;
}
function Counter() {
const [count, setCount] = useState(0);
return <button onClick={() => setCount(count + 1)}>Count: {count}</button>;
}Key point:
- Props are read-only, used to configure the component from outside.
- State is used to track internal changes, often in response to user interactions or logic updates.
Để lại một bình luận