React CountUp
npm install @dead_fish/react-countupjs
import {useState, useEffect} from 'react'
import CountUp from '@dead_fish/react-countup'
import '@dead_fish/react-countup/dist/lib/Countup.css'export default function App(){
const [count, setCount] = useState(0)
useEffect(() => {
// fetch data from server and set count
setTimeout(() =>{
setCount(123456)
}, 1000)
}, [])
return (
<>
{count === 0 ? 0 : (
value={count}
className='container'
itemClassName='item'
itemStyle={() => ({
fontSize: 30,
width: 100,
height: 100,
backgroundColor: '#ccc'
})}
/>
)}
>
)
}
``| Prop | Type | Default | Description |
| ------------- | -------- | ---------- | ---------------------------------------- |
| value | number | 0 | The value to be displayed |
| className | string | '' | The class name of the container |
| itemClassName | string | '' | The class name of each item |
| duration | number | 2 | The duration of the animation in seconds |
| style | object | {} | The style of the container |
| itemStyle | function | () => ({}) | The style of each item |