cricle-timer安装使用

代码库：https://www.npmjs.com/package/cricle-timer

注意 ：基于vue开发的插件，

1. 安装依赖

npm install cricle-timer

2. 注册到main.js

import Vue from 'vue';
import CricleTimer from 'cricle-timer';
Vue.use(CricleTimer);

使用方法

thresholds: 倒计时填充颜色，阶段阈值，以及颜色变化, color:颜色 threshold：阈值比例

start-time：倒计时开始秒数 on-finished: fun 倒计时结束触发的事件

<template>
  <div id="app">
    <CricleTimer
      :start-time="10"
      :step="-1"
      :on-finished="finished"
      :thresholds="[
        { color: '#FF9370', threshold: 0.5 },
        { color: '#FF1100', threshold: 0.25 }
      ]"
    />
  </div>
</template>

methods: {
  finished() {
    console.log('倒计时结束')
  }
}

src/components/cricle-timer.vue是组件， js文件export

npm run build 打包

Project setup

npm install

Compiles and hot-reloads for development

npm run serve

Compiles and minifies for production

npm run build

Lints and fixes files

npm run lint