利用elementUI里面的message做一个倒计时！简单实用

ita_code

于 2021-01-21 10:58:20 发布

阅读量2.6k

点赞数 7

CC 4.0 BY-SA版权

文章标签： elementui vue vue.js javascript es6

本文链接：https://blog.youkuaiyun.com/qq_43490372/article/details/112918190

这篇博客介绍了一个使用JavaScript和Element-UI库创建的倒计时功能。通过`hint`函数，实现了在修改密码成功后显示一个错误类型的消息，并在指定秒数后自动退出。代码中定义了`coutTime`函数进行递归调用来更新倒计时，同时在`hint`函数中结合了Element-UI的Message组件来展示倒计时信息。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

最近项目中需要一个退出倒计时，然而所以然就开始了下面的。直接代码简单直了

import { Message } from 'element-ui'
//倒计时函数
var a = null
function coutTime(index) {
    setTimeout(function () {
        if (index == -1) {
            //index s结束后的操作
        } else {
            a.message = `修改密码成功，${index}s后将自动退出`;
            coutTime(--index);
        }
    }, 1000);
};
export function hint(index) {
    a = Message({
        showClose: false,
        message: `修改密码成功，${index}s后将自动退出`,
        type: "error",
        duration: `${index}000`
    });
    index--
    coutTime(index);
}

使用的话就

import { hint } from '../hint.js'
            hint(3)

在这里插入图片描述