小程序待支付倒计时的实现

最新推荐文章于 2025-06-06 12:52:58 发布

一下子就醒了

最新推荐文章于 2025-06-06 12:52:58 发布

阅读量1k

点赞数

CC 4.0 BY-SA版权

分类专栏： Taro 前端杂谈

本文链接：https://blog.csdn.net/weixin_42442713/article/details/106330332

本文详细介绍了如何在Taro小程序开发中实现待支付订单的倒计时功能，包括遵循Taro语法的异步计时器函数的编写以及在页面渲染中的应用，最后展示了实现效果。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1、遵循框架taro语法

 componentDidMount() {
    this.fetchInitData(); 
  }

fetchInitData = () => {

    let {
      id
    } = this.$router.params;
    console.warn('detail get id ', id)
    if (id) {
      this.props.dispatch({
        type: 'order/personOrderDetail',
        payload: {
          personOrderId: id
        }
      }).then((res) => {   // 请求返回的订单创建时间
        const { personOrderCreateDate } = res.resultData;  // 订单创建的时间
        if (res.resultCode === 200) {
          this.computedLastPayTime(personOrderCreateDate)
        }
      })
      
    }
  }

2、异步计时器函数

computedLastPayTime = (createTime) => {
    let self = this;
    let lastPayTime = ''
    setInterval(function() {
      let startTime =new Date().getTime();   // 当前的时间戳
      let endTime = createTime + 60 * 60 * 1000;   // 订单创建的时间和一个小时的时间戳，单位毫秒
      let lastTime  = Math.floor((endTime - startTime) / 1000);
      let int_minute;
      if (lastTime > 0)