Skip to content

useCounter() ​

useCounter(initialValue?): object

Defined in: hooks/state/useCounter.ts:37

A custom React hook for managing a numeric counter state with helper functions. Provides functions to increment, decrement, and reset the counter value.

Parameters ​

initialValue? ​

number = 0

The initial value of the counter. Defaults to 0.

Returns ​

object

An object containing:

  • count: The current value of the counter.
  • increment: A function to increase the counter by 1.
  • decrement: A function to decrease the counter by 1.
  • reset: A function to reset the counter to its initial value.

count ​

count: number

increment() ​

increment: () => void

Returns ​

void

decrement() ​

decrement: () => void

Returns ​

void

reset() ​

reset: () => void

Returns ​

void

Example ​

tsx
import { useCounter } from '@zl-asica/react';

const CounterComponent = () => {
  const { count, increment, decrement, reset } = useCounter(10);

  return (
    <div>
      <p>Count: {count}</p>
      <button onClick={increment}>Increment</button>
      <button onClick={decrement}>Decrement</button>
      <button onClick={reset}>Reset</button>
    </div>
  );
};

Released under the MIT License.