element plus Message方法手动关闭,close方法使用

欢迎点击关注-前端面试进阶指南:前端登顶之巅-最全面的前端知识点梳理总结

*分享一个使用比较久的🪜

vue3.x setup写法是没有this的指向的;而element plus ui组件库也是没有的;近期的需求涉及到轮询接口,需要使用Message方法,Message 拥有可控的 duration, 默认的关闭时间为 3000 毫秒,当把这个属性的值设置为0便表示该消息不会被自动关闭。

js 复制代码
let message = null
message = ElMessage({
   duration: 0,
   message: statusObj[status],
   type: StatusType[status]
 })
 message.close()

调用 Message 或 this.$message 会返回当前 Message 的实例。 如果需要手动关闭实例,可以调用它的 close 方法。因为没有this方法,所以需要变量去接收它,这样才能拿到它的实例方法。

相关推荐
AI源码18 小时前
巨峰影视影院
vue3
RuoyiOffice20 小时前
UniApp企业办公:把审批、客户和项目装进手机,能做些什么?
spring boot·vue3·uniapp·crm·flowable·移动办公·企业应用
RuoyiOffice2 天前
SpringBoot OA推荐:面向信创选型,看看这套企业协同平台
spring boot·vue3·信创·flowable·企业协同·ruoyi office·oa选型
周厉2 天前
WebSocket 使用场景与实现方法:Java + Vue3 全栈实战
java·websocket·vue3·websocket双向通讯
红红谈说3 天前
同一套产品两个技术栈,双版本前端工程差异怎么收敛?
前端·uni-app·vue3·前后端分离·双版本维护·接口约定
RuoyiOffice4 天前
Flowable 状态通知设计:单体用本地事件,微服务如何回写业务状态?
spring boot·微服务·vue3·flowable·ruoyi office·redis stream·流程状态通知
AI开源软件4 天前
SpringBoot + Vue3 人力资源管理系统推荐:组织、档案与移动办公
vue3·springboot·ruoyi·oa系统·移动办公·人力资源管理系统·hrm
梅雅达编程笔记4 天前
Day 17 | uni-app 小程序:前端从零搭建
微信小程序·typescript·uni-app·vue3·pinia·前端开发·全栈
RuoyiOffice5 天前
项目预算和交付日期变了,为什么不能直接改台账?
spring boot·项目管理·vue3·flowable·业务建模·ruoyi office·项目变更
AI源码5 天前
图书馆借阅管理系统
vue3·springboot