使用场景类似于 订单倒计时,或答题倒计时,代码如下
在Vue中封装了如下的方法
data () {
return {
countdownTxt:'',//要显示的倒计时文案
};
},
// 定义一个方法 方便调用
methods: {
// @diffTime 传入秒数
countdownFun(diffTime) {
if (diffTime > 0) {
this.countdownTime = setInterval(() => {
let diffM =
Math.floor(diffTime / 60) > 9
? Math.floor(diffTime / 60)
: `0${
Math.floor(diffTime / 60)}`;
let diffS =
Math.floor(diffTime % 60) > 9
? Math.floor(diffTime % 60)
: `0${
Math.floor(diffTime % 60)}`;
this.countdownTxt = `${
diffM}分${
diffS}秒`;
// console.log(this.countdownTxt,'qqqqqwwwwwwwww')
diffTime--;
if (diffTime < 0) {
clearInterval(this.countdownTime);
return;
}
}, 1000);
},
}
原生js 和上面相差不大,修改相应的参数