一、示例
当点击按钮时就开始倒计时

代码

<template><view class="sq_box"><button class="button" @click="topay">按钮</button><u-modal v-model="modalShow" :show-cancel-button="true" :content="modalContent"><!-- 自定义确认按钮 --><template v-slot:confirm-button><button class="confirmBtn" :disabled="countdown > 0" @click="confirmAction">{{countdown > 0 ? `${countdown}秒` : '确认'}}</button></template></u-modal></view>
</template><script>export default {name: 'GeneratePoster',data() {return {//弹框modalShow: false,modalContent: '您确定进行操作吗?',countdown: 0, // 初始倒计时时间timer: null, // 计时器};},onLoad(option) {},methods: {// 倒计时time() {this.countdown = 3;this.timer = setInterval(() => {if (this.countdown > 0) {this.countdown -= 1;} else {clearInterval(this.timer);this.timer = null;}}, 1000);},topay() {this.modalShow = true//在这边也可以给modalContent赋值传值，修改为动态的文本都可以this.time()},confirmAction() {//点击确认之后触发}}};
</script><style lang="scss">
.confirmBtn{height: 52px;line-height: 52px;background-color: #fff;border: none !important;color: #2979ff;
}.confirmBtn{border: none !important;}
</style>