element ui 如何關閉訊息？ vue

vue vue.js element-ui

火爆浪子 2020-09-04 17:40:25 ‧ 1920 瀏覽

分享至

https://element.eleme.io/#/en-US/component/message

我在屬性中加入 duration: 0 可以避免他自動關閉
我想等到事件完成後再關閉該通知
於是

this.$message({
    duration: 0,
    message: '處理中'
})
this.$store.dispatch('update').then(res => {
    this.$message.success('成功')
}).catch(err => {
    this.$message.error(err)
})

但我不知道他要怎麼手動關閉 處理中 通知？
我有看到官方文件中的 Methods 有個 close 似乎可以呼叫
https://element.eleme.io/#/en-US/component/message#methods
但這要怎麼呼叫才對？官方沒有例子

登入發表討論

直播研討會

{{ item.channelVendor }} {{ item.webinarstarted }} |

直播中

2 個回答

gior__ann

iT邦新手 2 級 ‧ 2020-09-07 11:48:44

最佳解答

https://element.eleme.io/#/en-US/component/message

試試closable ??

你設定的 duration: 0 可以避免他自動關閉
手動關閉 >> 這樣就會有一個關閉按鈕
不知道是不是你要的?

回應 2
分享
檢舉

火爆浪子 iT邦研究生 1 級 ‧ 2020-09-10 14:22:44 檢舉

是，我也有用這個方式，只是想說如何用呼叫的關閉它

gior__ann iT邦新手 2 級 ‧ 2020-09-14 11:08:24 檢舉

參考:https://github.com/ElemeFE/element/issues/5037

這篇裡有個範例
可以試試~
https://jsfiddle.net/oqgkvxju/1/

登入發表回應

nero

iT邦新手 5 級 ‧ 2021-10-19 14:17:58

Message and this.$message returns the current Message instance. To manually close the instance, you can call close on it

这样写试试

const msgInstance = this.$message({
    duration: 0,
    message: '處理中'
})
this.$store.dispatch('update').then(res => {
    msgInstance.close()
    this.$message.success('成功')
}).catch(err => {
    msgInstance.close()
    this.$message.error(err)
})