This package has been deprecated

Author message:

Package no longer supported. Contact Support at https://www.npmjs.com/support for more info.

in-loop-counter

1.0.3 • Public • Published

[!WARNING] Package no longer supported. Instead use useRequestAnimationFrame React Hook

useInLoopCounter React Hook

React hook with in loop frame counter. For animation purposes. You can start, stop and pause loop while counting.

NPM JavaScript Style Guide

Install

npm install --save in-loop-counter

Usage

import React, { useState } from "react";

import { useInLoopCounter } from "in-loop-counter";

const Example = () => {
  const [counter, setCounter] = useState(0);

  const [start, setStart, setStop] = useInLoopCounter((data) => {
    setCounter(data.counter);
  });

  return (
    <div className="App">
      <h1>In loop frame counter</h1>
      <p>Hook with start-stop-pause behaviors</p>

      <div className="container">
        <h3 className="counter"> {counter}</h3>
        <div className="buttons">
          <button onClick={setStart}>{start ? "Start" : "Pause"}</button>
          <button onClick={setStop} disabled={start}>
            Stop
          </button>
        </div>
      </div>
    </div>
  );
};

Demo

Try it on CodeSandbox inLoopCounter React Hook

License

MIT © ja-klaudiusz

Readme

Keywords

none

Package Sidebar

Install

npm i in-loop-counter

Weekly Downloads

0

Version

1.0.3

License

MIT

Unpacked Size

6.21 kB

Total Files

7

Last publish

Collaborators

  • ja-klaudiusz