在使用beforeRouteLeave时要注意两点：

 1. next(false)阻止路由继续进行,若不先阻止，会多次执行守卫中的代码

 2. 利用setTimeout延时触发弹窗，避免出现闪现情况

vue-router离开当前页面提示未保存，解决在使用beforeRouteLeave弹窗多次闪现问题的更多相关文章

  1. 关于页面数据未保存改变路由（beforeunload，beforeRouteLeave）

    一下内容为笔者个人理解,如有出入还请大佬指出不胜感激 页面有数据未保存,用户离开页面分为两种 1 . 直接关闭浏览器标签 或者点击浏览器后退按钮 离开当前页面 2. 在页面内改变路由,或则刷新页面(不 ...

  2. chrome45以后的版本安装lodop后，仍提示未安装解决

    请先查看你chrome浏览器的版本,如果是45版本以前的版本,安装后仍提示 "未安装" 或 "请升级" 请参照本链接解决:http://blog.sina.co ...

  3. (Chrome42)Lodop总计页面提示“未安装”要么“请升级”可能的原因和解决方案

    Chrome42版本号之后,支持NP态,要手工打开,方法例如以下: 在谷歌浏览器地址栏输入: chrome://flags/#enable-npapi 然后找到"启用NPAPI"地 ...

  4. vue.js对列表进行编辑未保存随时变更

    1.不要建立在同一vm对象下 2.使用深拷贝$.extend(true, vm.model, obj); 3.开新标签页

  5. Vs Code在Vue项目中v-for指令提示错误的解决办法

    最近在做一个Vue项目,在其中用到v-for指令时,发现Vs Code报错,如下图(代码是没有任何问题的),在网上找了一下解决办法,希望能帮助到更多人. 解决方法: 打开    文件-首选项-设置 将 ...

  6. Vue实现离开页面二次确认

    在项目开发中遇到用户编辑内容后未保存推出编辑页面时需要提示用户"当前数据未保存,是否退出",实际开发中利用window.onbeforeunload方法与vue.$on方法在upd ...

  7. [Vue 牛刀小试]：第十二章 - 使用 Vue Router 实现 Vue 中的前端路由控制

    一.前言 前端路由是什么?如果你之前从事的是后端的工作,或者虽然有接触前端,但是并没有使用到单页面应用的话,这个概念对你来说还是会很陌生的.那么,为什么会在单页面应用中存在这么一个概念,以及,前端路由 ...

  8. Vue技术点整理-Vue Router

    路由 Vue Router 对于单页面应用来说,如果涉及到多个页面的话,就必须要使用到路由,一般使用官方支持的 vue-router 库 一,Vue Router 在项目中的安装引用 1,在页面中使用 ...

  9. 【Vue | ElementUI】Vue离开当前页面时弹出确认框实现

    Vue离开当前页面时弹出确认框实现 1. 实现目的 在某种业务场景下,用户不允许跳转到其他页面.于是,需要在用户误操作或者是点击浏览器跳转时提示用户. 2. 实现原理 使用路由守卫beforeRout ...

随机推荐

  1. Java流程控制与Scanner类的使用

    Java流程控制与Scanner类的使用 Scanner类 Scanner类可以使程序接受键盘输入,实现人机交互 一个完整的Scanner的使用例子: //创建一个扫描器对象,用于接收键盘数据 Sca ...

  2. 【中文】【deplearning.ai】【吴恩达课后作业目录】

    [目录][吴恩达课后作业目录] 吴恩达深度学习相关资源下载地址(蓝奏云) 课程 周数 名称 类型 语言 地址 课程1 - 神经网络和深度学习 第1周 深度学习简介 测验 中英 传送门 无编程作业 编程 ...

  3. Windows server 2008常用优化设置

    1. 如何取消开机按 CTRL+ALT+DEL登录? 控制面板→管理工具→本地安全策略→本地策略→安全选项→交互式登录:无须按CTRL+ALT+DEL→启用. 2. 如何取消关机时出现的关机理由选择项 ...

  4. C#高级编程第11版 - 第五章 索引

    [1]5.1 泛型概述 1.通过泛型,你可以创建独立于特定类型(contained types)以外的方法和类,而不用为不同类型编写多份同样功能的代码,你只需要创建一个方法或者类. 2.泛型类使用泛型 ...

  5. has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

    前端显示: has been blocked by CORS policy: Response to preflight request doesn't pass access control che ...

  6. timeout of 20000ms exceeded

    前端:axios请求超时 axios 中有两种超时错误,一种是 HTTP 的超时,另一种是你自定的超时时间. 请求多次,设置拦截器 ---在main.js设置全局的请求次数,请求的间隙 推荐解决方法: ...

  7. git的使用学习笔记---合并分支

    一.使用场景 不同的分支需要合并 二.操作 1.首先要创建一个分支 git checkout -b mergedemo 创建文本 vim text.txt 添加文本 git add text.txt ...

  8. 调度 GMP

    小结: 1. 当M从P的本地运行队列获取G时, 如果发现本地队列为空会尝试从其他P盗取一半的G过来,这个机制叫做Work Stealing, 2. Q M一定需要p吗? A 不一定.M正在执行原生代码 ...

  9. （Oracle）取当前日期的最近工作日

      描述:现有一需求,日期表中存放了日期和是否节假日(0-工作日,1-节假日),现在需要取日期表中的最近的工作日.如2017/07/23(周日)最近的工作日应该是2017/07/21(周五).     ...

  10. 一个关于ExecutorService shutdownNow时很奇怪的现象

    我们知道很多类库中的阻塞方法在抛出InterruptedException后会清除线程的中断状态(例如 sleep. 阻塞队列的take),但是今天却发现了一个特别奇怪的现象,先给出代码: publi ...