Home
Basics
Introduction Setting up environment First Component JSX Component lifecycle Class Based Components Function Based Components Props State Hooks useState hook useEffect hook Events Server requests CSS in React Router third party JavaScriptAdvanced
useContext hook useRef hook useReducer hook Memo useCallback hook Custom Hooks React and ReduxMiscellaneous
React Third Party Components Html templates in React React Interview QnAuseState hook in React
useState hook is used to store the state of component. Everytime you change the state, component will re-render and UI will get updated. If you do not want the component to re-render, you can use useRef hook instead. In below example, we have created a timer which will start running as soon as component is rendered. Component will re-render after every 1 second and show updated count(state). a ZZZ A2Q3
import { useEffect, useState } from "react";
function Counter() {
const [count, setCount] = useState(0);
function incrementCounter() {
setCount((prev) => {
return ++prev;
});
}
useEffect(() => {
setTimeout(incrementCounter, 1000);
});
return <span>counter {count}</span>;
}
export default Counter;
Web development and Automation testing
solutions delivered!!