Vue.js 2的倒计时组件 – vue2-flip-countdown

Vue.js 2的倒计时组件 – vue2-flip-countdown

插件名称:vue2-flip-countdown

发布时间:2020年6月18日

插件作者:philipjkim

官网 演示 GitHub下载

Vue 2.x的一个简单的翻转倒数计时器组件。

变更日志:

2020年9月20日

  • v0.11.1

2020/09/12

  • 添加showHours,showMinutes和showSeconds以控制部分的曝光

v0.12.0(06/16/2020)

  • 添加`showDays`道具来控制“天”部分的曝光

安装和下载:

# NPM
$ npm install vue2-flip-countdown --save

使用:

<template>
  <div>
    <flip-countdown deadline="2018-12-25 00:00:00"></flip-countdown>
  </div>
</template>

<script>
  import FlipCountdown from 'vue2-flip-countdown'

  export default {
      components: { FlipCountdown }
  }
</script>

如果要删除天数部分,请将showDaysprop 设置为false(自v0.10.0起可用):

<flip-countdown deadline="2018-12-25 00:00:00" :showDays="false"></flip-countdown>

请参考/demo目录以获取示例。

如果您使用的是Nuxt.js<no-ssr>请避免使用服务器端渲染。(如果不使用,则会出现错误<no-ssr>

<template>
  <div>
    <no-ssr>
      <flip-countdown deadline="2018-12-25 00:00:00"></flip-countdown>
    </no-ssr>
  </div>
</template>
相关插件