1.0.3 • Published 2 years ago
in-loop-counter v1.0.3
!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.
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