element Notification一次只显示一条

最新推荐文章于 2023-11-15 14:19:35 发布

aeoliancrazy

最新推荐文章于 2023-11-15 14:19:35 发布

阅读量1.5k

点赞数

分类专栏： element 文章标签：前端 javascript

本文链接：https://blog.csdn.net/aeoliancrazy/article/details/126299024

版权

element 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

element Notification一次只显示一条
而不是累计的不停弹出，堆积在页面上
但是，清注意，我的方法，会清掉，之前的弹窗提示

ElNotification.closeAll()

本文使用 vite+ts +vue3

watch(data, async (val: string) => {
  if (val) {
    const payload = JSON.parse(val) as AlarmMsg
    if (payload.type === 'popup') {
    //下面这句是重点，清空了，之前的所有提示
      await ElNotification.closeAll()
      ElNotification({
        title: '告警提示',
        message: h(
          'a',
          {
            style: { cursor: 'pointer' },
            onClick: () => {
              router.push({ name: 'alarmRecord', params: { alarmRecordId: payload.alarmRecordId, strategyType: payload.strategyType } })
              menuStore.setLeftMenuActive('/alarmManagement')
              menuStore.setRightMenuActive('/alarmRecord')
            },
          },
          payload.msg,
        ),
        duration: 3000 * 10,
        position: 'bottom-right',
        type: 'warning',
      })
    }
    else {
      const sound = new Howl({
        src: payload.msg ? getPreviewUrl() + payload.msg : defaultMp3,
      })
      // 播放声音
      sound.play(undefined, false)
    }
  }
})