wxc-countdown

Weex 倒计时组件

Demo

wxc-countdown 倒计时 - 图1 wxc-countdown 倒计时 - 图2

参数配置

Prop Type Required Default Description
time Number Y 1501200000000 最终时间戳
interval Number N 1000 间隔,单位为"毫秒"
tpl String N {h}:{m}:{s} 展示模板
onComplete Function N ()=>() 完成时调用的方法
timeWrapStyle Object N - 最外层包裹 style
timeBoxStyle Object N - 数字盒子 style
dotBoxStyle Object N - 符号盒子 style
timeTextStyle Object N - 数字文字 style
dotTextStyle Object N - 符号文字 style

使用方法

  1. <template>
  2.   <wxc-countdown tpl="{d}天{h}时{m}分{s}秒" :time="TIME"></wxc-countdown>
  3. </template>
  4. <script>
  5.     import { WxcCountdown } from 'weex-ui'
  6.     export default {
  7.       components: { WxcCountdown },
  8.       data: () => ({
  9.         TIME: new Date().getTime() + 86400000 + ''
  10.       })
  11.     }
  12. </script>

更详细代码可以参考 demo

Please feel free to use and contribute to the development.

原文: https://alibaba.github.io/weex-ui/#/cn/packages/wxc-countdown/