this.$notify自定义取消按钮事件触发

本人使用方法

//首先生命周期mounted里面加上下列代码
  document.addEventListener('mouseup', (e) => {
      let _track = document.getElementById('tanbtn'); if (_track) {//这个id和下面自定义按钮的id要保持一致
        if (_track.contains(e.target)) {
          this.closeNotify();//自定义要触发的事件
        }}
    })


//下方是定义的通知栏以及调用

 let message= ''
          
             if(this.currentData.unFinishedCnt+ this.currentData.unReceivingCnt!=0){
              message= '<span>其他部门未接单' + this.currentData.unReceivingCnt + '条，未完成' + this.currentData.unFinishedCnt + '条!</span> <span class="tanbtn" id="tanbtn" @click="closeNotify">查看</span>'
             }else{
              message='<span>无其他部门未处理工单!</span>'
             }


 this.notify = this.$notify({
              title: '通 知',
              message: message ,
              dangerouslyUseHTMLString: true,
              // 无其他科室未处理工单
              showClose: false,
              // onClick: () => {  这里是关闭整个窗口的点击事件
              //   // this.notify.close();
              //   this.$router.push('/WorkOrderQuery?del=999')
              // },
              duration: 0,
              offset: 0
            });

还有一种是别人的方法，本人没有试过，代码如下

下面这段代码是vue的methohs中某个方法的部分代码，作用在notifycation上添加按钮，在点击按钮之后实现路由跳转，同时关闭该消息弹窗
let routeData = this.$router.resolve({
  name: 'checkingIn',
  query: {gradeId: grade, curriculumId: curriculumId, lessonsId: this.lessonsId}
})
const h = this.$createElement
let notify = this.$notify({
  title: '开始考勤提醒',
  message: h('p', null, [
    msg,
    h('a',
      {
        attrs: {href: routeData.href, target: '_blank'}  // 在新窗口加载路由
     },
      [
        h('el-button', {
          style: {
            float: 'right'
          },
          attrs: {
            size: 'small',
            type: 'primary'
          },
          on: {
            click: this.closeNotify // 路由加载之后，调用关闭消息弹窗的方法
          }
        }, '开始考勤')
      ]
    )
  ]),
  position: 'bottom-right',
  duration: 0,
  offset: 20,
  dangerouslyUseHTMLString: true
})
methohs中的关闭弹窗的方法：
// ************************* 点击开始考勤消息弹窗关闭 **********************
closeNotify () {
  if (this.notifyList.length !== 0) {
    this.notifyList[0].close()
  }
}
总结：
1.上面标红部分特别注意，它是调用关闭消息通知弹窗的方法，使用的时候只能有方法名，在方法名之后带括号会报错，不清除为啥会这么奇怪
2. this.$notify会返回一个实例，我项目中弹窗是多个，我把它们放到notifyList中了，每个实例都有close()方法，用于关闭消息弹窗