微信小程序日期增加时间完成订单失效倒计时(有效果图)

效果图

.wxml

复制代码
<view class="TimeSeond">{{second}}</view>

.js

复制代码
Page({
  data: {
    tiem_one:'',
    second:'',//倒计时
    deadline:'',
  },
  onLoad(){
    this.countdown();
  },
  countdown(){
    let timestamp = Date.parse(new Date()) / 1000;//当前时间戳
    let time = this.addtime('2024-4-19 17:20:00');//当前时间转时间戳
    if(time > timestamp){
      this.deadline = (time - timestamp) * 1000
      this.setData({
        deadline:this.deadline
      })
      this.single()
    }else{
      that.setData({
        second:'00:00'
      })
    }
  },
  addtime(time){
    let date = new Date(time);
    let minutes = date.getMinutes();
    date.setMinutes(minutes+30);//增加三十分钟
    return Date.parse(date) / 1000;
  },
  single(e){
    var that = this
    var time = that.deadline,minutes,seconds;
    that.tiem_one = setInterval(function() {
      time = time - 1000
      minutes = parseInt((time % (1000 * 60 * 60)) / (1000 * 60));
      seconds = parseInt((time % (1000 * 60)) / 1000);
      if (time < 1) {
        that.setData({
          second:'00:00'
        })
        clearInterval(that.tiem_one)
        return false
      }
      minutes = minutes > 9 ? minutes : '0' + minutes
      seconds = seconds > 9 ? seconds : '0' + seconds
      that.setData({
        second:minutes + ':' + seconds
      })
    },1000)
  },
})

遇到问题可以看我主页加我Q,很少看博客,对你有帮助别忘记点赞收藏。

相关推荐
Stanford_11061 小时前
关于嵌入式硬件需要了解的基础知识
开发语言·c++·嵌入式硬件·微信小程序·微信公众平台·twitter·微信开放平台
明月(Alioo)1 小时前
用AI帮忙,开发刷题小程序:软考真经微信小程序API接口文档(更新版)
微信小程序·小程序
克里斯蒂亚诺更新7 小时前
微信小程序的页面生命周期 以及onShow的应用场景
微信小程序·小程序
江城开朗的豌豆9 小时前
小程序避坑指南:这些兼容性问题你遇到了几个?
前端·javascript·微信小程序
江城开朗的豌豆9 小时前
玩转小程序页面跳转:我的路由实战笔记
前端·javascript·微信小程序
zluz_18 小时前
微信小程序,组件中使用全局样式
微信小程序·小程序
明月(Alioo)20 小时前
用AI帮忙,开发刷题小程序:微信小程序中实现Markdown图片解析与渲染功能详解
微信小程序·小程序·aigc
aiguangyuan1 天前
微信小程序中的双线程模型及数据传输优化
微信小程序·前端开发
笨笨狗吞噬者1 天前
【uniapp】小程序体积优化,JSON文件压缩
前端·微信小程序·uni-app
小小前端_我自坚强1 天前
UniApp 微信小程序开发使用心得
面试·微信小程序·代码规范