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

// app.js
App({
onLaunch: function () {
// 小程序启动时执行的代码
},
globalData: {
countdown: 10,
timer: 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: 10,
},
startCountdown: function () {
const app = getApp()
if (app.globalData.timer === null) {
app.globalData.timer = setInterval(() => {
app.globalData.countdown -= 1
this.setData({ countdown: app.globalData.countdown })
}, 1000)
} else {
clearInterval(app.globalData.timer)
app.globalData.timer = null
}
}
})
这个小程序有一个页面,页面上有一个按钮。当用户点击按钮时,会启动一个倒计时,每秒钟减少1,倒计时剩余时间显示在页面上。如果用户再次点击按钮,倒计时将停止,并重新开始计时。