1.0.4 • Published 5 years ago
countdown-universal v1.0.4
countdown-universal
A simple countdown js library
Features
You can install it in a Vue, React, Angular, or React Native project.
This project uses es6 syntax by default.
Install
npm i countdown-universal --save
// or
yarn add countdown-universal
Usage
import Countdown from 'countdown-universal'
class Example {
getCode() {
const that = this
this.timer = new Countdown({
date: +(new Date) + 60000,
// default date: 'May 15, 2030 17:38:22',
refresh: 1000,
offset: 0,
onEnd() {
// that.setState({tips: 'xxx'}) In React or React Native
// that.tips = 'xxx' In Vue or Angular
// ...
},
renderer({years, days, hours, min, sec, ms}) {
const secStr = this.zeroFill(sec, 2) + 'sec' // built-in function; n => 0n
if (secStr !== 0) {
// that.setState({tips: secStr}) In React or React Native
// that.tips = secStr In Vue or Angular
// ...
}
}
})
}
stop() {
this.timer.stop()
}
start() {
this.timer.start()
}
update() {
this.timer.update(+(new Date) + 30000)
}
/**
* Manually adjust the offset
* @param milliseconds
*/
updateOffset(milliseconds) {
this.timer.updateOffset(milliseconds)
}
}
Api
Name | Type | Default | Description |
---|---|---|---|
options | object | - | Configuration option |
options.date | any | May 15, 2030 17:38:22 | The end date |
options.refresh | number | 1000 | Refresh interval |
options.offset | number | 0 | Offset |
options.onEnd | function | - | Callback function after countdown |
options.renderer | function | - | Callback function of rendering component |