1.0.9 • Published 1 year ago

cricle-timer v1.0.9

Weekly downloads
-
License
-
Repository
-
Last release
1 year ago

cricle-timer安装使用

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

注意 :基于vue开发的插件,

  1. 安装依赖
npm install cricle-timer
  1. 注册到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