微信小程序-倒计时功能实现代码

以下是一个简单的微信小程序示例，可以显示一个按钮和点击按钮后的倒计时器：

// app.js
App({
  onLaunch: function () {
    // 小程序启动时执行的代码
  },
  globalData: {
    countdown: null,
  }
})

<!-- index.wxml -->
<view class="container">
  <button bindtap="startCountdown">开始倒计时</button>
  <text>剩余时间: {{ countdown }}</text>
</view>

/* index.wxss */
.container {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100vh;
}

button {
  margin-top: 20px;
  padding: 10px 20px;
}

// index.js
Page({
  data: {
    countdown: null,
  },
  startCountdown: function () {
    const app = getApp()
    let count = 10 // 设置倒计时秒数
    app.globalData.countdown = setInterval(() => {
      count--
      app.globalData.countdown = count
      this.setData({ countdown: app.globalData.countdown })
      if (count === 0) {
        clearInterval(app.globalData.countdown) // 倒计时结束，清除定时器
      }
    }, 1000) // 每秒更新一次倒计时数字
  }
})

这个小程序有一个页面，页面上有一个按钮。当用户点击按钮时，程序会调用startCountdown函数，开始一个倒计时器。倒计时器每秒钟更新一次，将剩余秒数存储在全局变量countdown中，并使用setInterval方法定时更新页面上的倒计时数字。当倒计时结束时，程序会清除定时器并停止更新倒计时数字。请注意，这只是一个简单的示例，实际应用中可能需要更多的错误处理和界面优化。