react-count-animation


Using TWEEN algorithm, digital animation based on react.

Display

!display

Install

``markdown
npm install react-count-animation@latest
`

How to use

import stylesheet:

`js
import 'react-count-animation/dist/count.min.css';
`

`js
import React from 'react';
import ReactDOM from 'react-dom';
import AnimationCount from 'react-count-animation';

const Count = () => {
const settings = {
start: 99923,
count: 9999999,
duration: 3000,
decimals: 4,
useGroup: true,
animation: 'up',
};
const settings2 = {
start: 1,
count: 9999999,
duration: 1000,
decimals: 2,
useGroup: true,
animation: 'roll',
};
const settings3 = {
start: 1,
count: 9999999,
duration: 3000,
decimals: 2,
useGroup: true,
animation: 'slide',
};
return (


);
}

export default Count;
``

Options

Property | Type | Description
------------- | ------------- | -------------
start | Number | Initial value
count | Number | target value
duration | Number | Animation time length, in milliseconds
decimals | Number | decimals
useGroup | bool | Whether to use ',' the number of segments
animation | string | Animation effects:
'up' => 'CountUp';
'roll' => 'CountRoll'
'slide' => 'CountSlide'

License

MIT