JSPM

  • Created
  • Published
  • Downloads 5
  • Score
    100M100P100Q60916F

A React Hooks package for counter

Package Exports

  • @rooks/use-counter

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@rooks/use-counter) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

@rooks/use-counter

Counter hook for React.


Build Status

Join the community on Spectrum

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}