Spaces:
Sleeping
Sleeping
| React Hooks are functions that let you use state and lifecycle features in functional components. | |
| Introduced in React 16.8 to replace class components. | |
| useState: manages local component state. | |
| Syntax: const [state, setState] = useState(initialValue) | |
| Example: const [count, setCount] = useState(0) | |
| useEffect: handles side effects like API calls, subscriptions, DOM updates. | |
| Runs after every render by default. | |
| Syntax: useEffect(() => { /* effect */ }, [dependencies]) | |
| Empty dependency array [] means run only once on mount. | |
| useContext: consume React context without wrapping in Consumer component. | |
| Syntax: const value = useContext(MyContext) | |
| useRef: holds mutable value that does not trigger re-render. Also used to access DOM elements. | |
| Rules of Hooks: | |
| 1. Only call hooks at the top level (not inside loops or conditions). | |
| 2. Only call hooks from React function components or custom hooks. |