vue实现倒计时功能

如下图，点击发送验证码，出现倒计时60s。

image.png

结构代码：

<div class="password_content_right">
    <el-form ref="AccountFrom" :model="account" :rules="rules" label-position="left" label-width="0px" class="password_form">
        <h3 class="password_title">找回密码</h3>
        <el-form-item prop="email">
            <el-input type="text" v-model="account.email" auto-complete="off" placeholder="用户名" autofocus="autofocus" clearable @keyup.enter.native="next"></el-input>
        </el-form-item>
        <el-form-item prop="verify">
            <el-input type="text" v-model="account.verify" auto-complete="off" placeholder="验证码" ref="autofocus_verify" @keyup.enter.native="verifyNext"></el-input>
            <el-button type="text" class="findPassword" @click.native="sendVerify">{{lastTimeContent}}</el-button>
        </el-form-item>
        <el-form-item prop="password" >
            <el-input type="password" v-model="account.password" auto-complete="off" placeholder="密码" ref="autofocus_pwd" @keyup.enter.native="handleConfirm"></el-input>
        </el-form-item>
        <el-form-item style="width:100%;">
            <el-button type="primary" style="width:100%;height:62px;font-size:24px;letter-spacing:4px;" @click.native.prevent="handleConfirm" :loading="loading">确认</el-button>
        </el-form-item>
    </el-form>
</div>

样式代码：

.findPassword{
    position: absolute;
    top: 0px;
    right: 10px;
    bottom: 0px;
}

【注】：逻辑代码：

// 发送验证码
sendVerify(){
    if(this.account.email){
        if(this.lastTimeContent == '发送验证码'){
            let lastTime = 59;
            let timer = setInterval(() => {
                if(lastTime>0){
                    this.lastTimeContent = lastTime + 's';
                    lastTime--;
                } else {
                    window.clearInterval(timer);
                    this.lastTimeContent = '发送验证码'
                }
            }, 1000);

            // 请求接口
            http.sendEmailVerify({email: this.account.email}).then(res => {
                
            })
        } else {
            this.$message({
                message: '请不要频繁点击哦',
                type: 'warning'
            });
        }
    } else {
        this.$refs.AccountFrom.validateField('email');      // 主动验证
    }
},