dependabot[bot] ec763fabae
Bump lodash from 4.17.11 to 4.17.15
Bumps [lodash](https://github.com/lodash/lodash) from 4.17.11 to 4.17.15.
- [Release notes](https://github.com/lodash/lodash/releases)
- [Commits](https://github.com/lodash/lodash/compare/4.17.11...4.17.15)

Signed-off-by: dependabot[bot] <support@github.com>
2019-11-01 19:18:36 +00:00
2019-01-29 01:24:31 +08:00
2018-10-22 11:28:26 +08:00
2018-10-22 11:28:26 +08:00
2018-10-22 20:41:31 +08:00
2019-08-12 18:22:21 +08:00
2018-10-22 20:41:31 +08:00
2018-10-25 11:51:32 +08:00
2019-11-01 19:18:36 +00:00

vue-flip-down npm npm

这是一个简单的翻页倒计时vue组件项目中有用到所以提取了一下。
你们也可以直接把src/app.vue文件拷贝到项目里直接用,就不用npm install

示例

img

安装

npm install vue-flip-down --save

yarn add vue-flip-down 

使用

import FlipDown from 'vue-flip-down';

<FlipDown
  :endDate="1540212399971"  // 倒计时截止的日期
  @timeUp="func"            // 时间到了会触发timeUp事件
/>

参数

名称 类型 默认 描述
endDate Date/Number 0 结束的时间即倒计时会从当前时间一直到endDate停止可以是一个日期对象也可以是毫秒数
type Number 4 要怎么显示倒计时4-日时分秒3-时分秒2-分秒1-秒
theme Number 1 样式1-合并2-分离。见下图
timeUnit Array [] 时间单位,显示在空隙之间的文字,比如:['天','时','分','秒'] 或 [':',':',':']

:theme="1" 合并式

img

合并式的,每个不同的时间单位是合在一起的

:theme="2" 分离式

img

分离式的,每个数字都是单独分开的

事件

名称 返回值 描述
timeUp null 当倒计时走到0时会触发一次表示时间到了

说明

  • 内部使用了setTimeout当倒计时结束后就会停止循环。但可以动态改变日期倒计时又会被激活。
  • 基于本地时间做对比
Description
vue 翻页倒计时组件 妙啊
Readme 616 KiB
Languages
Vue 90.4%
TypeScript 6.8%
HTML 2.8%