vux 60秒倒計時

60秒倒計時

<style lang="scss"> </style>

<template>
    <x-button :disabled="checkCode.disabled" @click.native="getCode">{{checkCode.text}}</x-button>
</template>

<script> import { XButton } from "vux"; export default { name: "probation", components: { XButton }, data() { return { checkCode: { text: "獲取驗證碼", TIME: 6, disabled: false } }; }, methods: { //獲取驗證碼按鈕 getCode() { this.checkCode.text = this.checkCode.TIME; this.checkCode.disabled = true; this.countDown(); }, //倒計時 countDown() { console.log(this.checkCode.text); var _this = this; if (this.checkCode.text == 0) { this.checkCode.text = "獲取驗證碼"; this.checkCode.disabled = false; return false; } var time = setTimeout(function() { _this.checkCode.text--; _this.countDown(); }, 1000); } } }; </script>
複製代碼