vue3路由跳转离开前弹窗确认

进击的potato

已于 2024-06-06 17:32:31 修改

阅读量709

点赞数 3

文章标签： vue.js 前端 javascript

于 2024-06-06 17:32:19 首次发布

本文链接：https://blog.csdn.net/m0_56683897/article/details/139506109

版权

如题，这种时候监听路由会十分不便，并且还要做到拦截，使用onBeforeRouteLeave即可。

import { onBeforeRouteLeave } from "vue-router";  // 需要v3引入


onBeforeRouteLeave((to, from, next) => {
    ElMessageBox.confirm("修改尚未保存，是否确认离开？", "提示", {
      confirmButtonText: "确定",
      cancelButtonText: "取消",
      type: "warning"
    }).then(() => {
      next()
    }).catch(() => { });
  }
});