1.0.4 • Published 5 years ago

countdown-universal v1.0.4

Weekly downloads
2
License
MIT
Repository
github
Last release
5 years ago

countdown-universal

A simple countdown js library

release PRs Welcome NPM version License MIT

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

NameTypeDefaultDescription
optionsobject-Configuration option
options.dateanyMay 15, 2030 17:38:22The end date
options.refreshnumber1000Refresh interval
options.offsetnumber0Offset
options.onEndfunction-Callback function after countdown
options.rendererfunction-Callback function of rendering component