目录

一、问题

二、解决方法

三、总结

---

一、问题

1.使用了 element-ui的 this.$notify进行消息提示，但提示是全局的，切换页面后依然存在，但我希望切换页面后消失。

let notify = _this.$notify({
      title: "提示",
      position: 'bottom-right',
      message: "请填写交接单",
      duration: 0,
      onClose: () => {
        _this.handOverFormNotify = null;
      },
      onClick:()=>{
      },
    });

二、解决方法

1.想通过监听路由来控制消息 显示和关闭，但是发现使用 $route 无法生效---子组件中监听route不可行。

2.思考后发现，Vue的生命周期函数就是记录组件(页面）的生命周期的

3.将取消消息通知的代码写在 beforeUnmount 或 unmounted 生命周期函数中就可以了。

  beforeUnmount(对应Vue2中的beforeDestroy）中手动关闭

beforeUnmount(){
      notify.close();
}

三、总结

1.页面需要在某个阶段做什么事情，直接写在对应的 生命周期函数 里就可以了。当你觉得某个事件处理的时机自己无法确定时，请先考虑生命周期函数。

2.创建好notify消息提示后，可以通过变量更改对应的属性。

   如上面代码中 可以通过动态  notify.message="hello,please write handoverForm"修改提示的信息。

/*

希望对你有帮助！

如有错误，欢迎指正！

*/