Version: v4.11.0

use-counter

About#

Counter hook for React.

Installation#

npm install --save @rooks/use-counter

Importing the hook#

import useCounter from "@rooks/use-counter"

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#

Argument	Type	Description
initialValue	number	Initial value of the counter

Return#

Return value	Type	Description
counter	Object	Object 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.