react-number-increment v0.0.14

React Number Increment

A configurable React component For counting up the number in your React appilcation. react-number-increment.

Installation

yarn add react-number-increment

npm install react-number-increment

Import

import Counter from "react-number-increment";

Simple example

<Counter />

This will start a count up transition from 0 to 100 on render with speed of 1ms.

Example

// import "./App.css";
import Counter from "react-number-increment";

function App() {
  return (
    <div className="App">
      <Counter
        start=0 // starting
        end=500 // ends
        speed=1 // 100ms
        decrement // in case if you want to decrement
        style={{ fontSize: "200px", fontWeight: 900 }} // add custom style
        threshold=1 // viewport 1=100%,
        child="+" // add childs ie + , - , *
        offset=5 // increments by 5
        seperate="," // seperates number in comma
       />
    </div>
  );
}

export default App;

Note that offsetend={4} will add the offset to the ending value.

Add end and starting Number

<Counter offsetend={4} speed={10} end={10} />

Tip: If you need to start the render prop component immediately, you can set speed={0}.

If you know about default values 👍

License ISC