代码拉取完成,页面将自动刷新
vue 倒计时组件
yarn add mv-count-down
or
npm i mv-count-down
http://null_639_5368.gitee.io/mv-count-down
<template>
<div class="home">
<mv-count-down @startCallback="countDownS"
@endCallback="countDownE"
:startTime="startTime"
:endTime="endTime"
:endText="endText"
:dayTxt="'天'"
:hourTxt="'小时'"
:minutesTxt="'分钟'"
:secondsTxt="'秒'"
:isStart="isStart"></mv-count-down>
<a class="link-blue"
href="https://gitee.com/null_639_5368/mv-count-down/blob/master/src/views/Home.vue">查看demo</a>
</div>
</template>
<script>
import MvCountDown from 'mv-count-down'
export default {
name: 'home',
components:
MvCountDown
},
data () {
return {
startTime: new Date().getTime(), // 开始时间(时间戳)
endTime: 0, // 完成的时间(时间戳)
endText: '', // 倒计时完成的提示文本
isStart: false // 控制倒计时开始的时机(异步请求完成开启)
}
},
created () {
this.setEndTime(10);
},
methods: {
callback () {
// coding .......
},
// 设置结束时间推迟多少秒并转时间戳
setEndTime (value) {
let curTime = new Date();
let newTime = new Date(curTime.setSeconds(curTime.getSeconds() + value));
this.endTime = newTime.getTime();
this.isStart = true;
},
countDownS (x) {
// 开始倒计时回调
console.log(x)
},
countDownE () {
// 结束倒计时回调
this.callback();
}
}
}
</script>
万分感谢各位,作者也就 2 年经验以后多加努力。
此处可能存在不合适展示的内容,页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容,可点击提交进行申诉,我们将尽快为您处理。
1. 开源生态
2. 协作、人、软件
3. 评估模型