1.2.8 • Published 4 years ago
react-better-countdown v1.2.8
react-better-countdown
react-better-countdown is a simple count down component using react.
Installation
npm install react-better-countdown --save
Usage
import Countdown from 'react-better-countdown'
<Countdown count={Date.now() + 1000} className="count-wrapper" style={{color: 'red'}} dayText="天" callback={() => {}} />| Prop | Type | Default | Description |
|---|---|---|---|
| count | number | Date.now() | the timestamp in the future, Date.now() is neccesarry, unit is milliseconds |
| dayText | string | ReactNode | 'day' | the text nearby day,dayText="天" means 10天10:33:22 |
| hourText | string | ReactNode | ':' | the text nearby day,hourText="时" means 10天10时33:22 |
| minuteText | string | ReactNode | ':' | the text nearby day,minuteText="分" means 10天10时33分22 |
| secondText | string | ReactNode | '' | the text nearby day,secondText="秒" means 10天10时33分22秒 |
| callback | function | ()=>{} | when count turns to zero, callback executes |
| className | string | '' | the class of the wrapper element |
| style | object | {} | custom style on the wrapper element |
Styles
react-better-countdown can be used with your own custom styles.