Skip to main content
Version: 5.0.3

useCounter

About#

Counter hook for React.


Installation#

npm install --save rooks

Importing the hook#

import { useCounter } from 'rooks';

Usage#

function CounterComponent() {
const {
value,
increment,
decrement,
incrementBy,
decrementBy,
reset,
} = useCounter(3);
function incrementBy5() {
incrementBy(5);
}
function decrementBy7() {
decrementBy(7);
}
return (
<>
Current value is {value}
<hr />
<button onClick={increment}>increment</button>
<button onClick={decrement}>decrement</button>
<button onClick={incrementBy5}>incrementBy5</button>
<button onClick={decrementBy7}>decrementBy7</button>
<hr />
<button onClick={reset}>reset</button>
</>
);
}
render(<CounterComponent />);

Arguments#

ArgumentTypeDescription
initialValuenumberInitial value of the counter

Return#

Return valueTypeDescription
counterObjectObject containing {value,increment,decrement,incrementBy,decrementBy,reset}

Codesandbox Examples#

Basic Usage#

Join Bhargav's discord server#

You can click on the floating discord icon at the bottom right of the screen and talk to us in our server.

Last updated on by imbhargav5