Vue 离开页面时的校验-mixin-beforeRouteLeave
一定要看下函数前的注释, 需要在使用的页面定义【needCheckFlag】data属性
一定要看下函数前的注释, 需要在使用的页面定义【needCheckFlag】data属性
一定要看下函数前的注释, 需要在使用的页面定义【needCheckFlag】data属性
/**
* what for: check when leave
* how to use:
* step-1: import routeLeaveCheck from '@/mixins/router/leave-check'
* step-2: mixins: [routeLeaveCheck],
* step-3:
* define 【 needCheckFlag 】 in your own vue file(default value is true)
* sometime you dont' need checking when leave this page(click button, router-link etc..),
* you can change the value to be "false" before such kind operations
*/
export default {
beforeRouteLeave(to, from, next) {
if (this.needCheckFlag) {
this.$confirm('确定离开此页面?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
// some logic
next()
})
.catch(() => { next(false) })
} else {
next()
}
}
}
Vue 离开页面时的校验-mixin-beforeRouteLeave的更多相关文章
- JavaScript当离开页面时可以进行的操作
当JavaScript离开页面时可以进行的操作 window.onbeforeunload = function() { var email = document.getElementById(&qu ...
- vue进入页面时不在顶部,检测滚动返回顶部按钮
这里是本小白使用时遇到的问题及个人使用的方法可能并不完美. 1.监测浏览器滚动条滚动事件及滚动距离 dmounted() { window.addEventListener("scroll& ...
- Jquery判断离开页面时,通过Ajax更新数据(兼容IE,Chrome,FF浏览器)
现在很多项目都有客户离开网页时,处理一些业务的需求.所以焦点就聚集在了如何获取页面离开事件. 以下是本人在一个项目中需要记录页面浏览时长的处理办法,测试兼容IE,Chrome,FF浏览器 代码如下: ...
- Jquery关闭离开页面时提醒
[导读] 离开页面提示多般是放到了发新闻或写日志的页面,我们在百度空间或QQ空间在我们未保存信息时如果离开页面都有提示了,下面我来介绍利用jquery的beforeunload来实现此方法. jque ...
- Vue切换页面时中断axios请求
一.概述 在Vue单页面开发过程中,遇到这样的情况,当我切换页面时,由于上一页面请求执行时间长,切换到该页面时,还未执行完,这时那个请求仍会继续执行直到请求结束,此时将会影响页面性能,并且可能对现在页 ...
- vue离开页面销毁定时器
beforeDestroy() { if(this.timer) { clearInterval(this.timer); //关闭 } //利用vue的生命周期函数 vue 是单页面应用,路由切换 ...
- vue离开页面销毁滚动事件
methods:{ handleFun(){ /**销毁处理*/ } }, beforeDestroy(){ window.removeEventListener("scroll&qu ...
- 【原】js离开页面执行函数 onbeforeunload与onunload事件
在最近的项目中,需要做到一个时间,就是用户离开页面的时候,我需要缓存页面其中一部分的内容,但是我不需要用户刷新的时候也缓存,我只希望在我用户离开的时候 执行这个函数.百度之,有onbeforeunlo ...
- js捕捉IE窗口失去焦点事件,判断离开页面刷新或关闭的方法
js捕捉IE窗口失去焦点事件,判断离开页面刷新或关闭的方法 javascript如何捕捉IE窗口失去焦点事件window.onblur = function(e) { //you code}; 弹框的 ...
随机推荐
- Java常用API(String类)
Java常用API(String类) 概述: java.lang.String 类代表字符串.Java程序中所有的字符串文字(例如 "abc" )都可以被看作是实现此类的实例 1. ...
- Ethical Hacking - GAINING ACCESS(23)
CLIENT SIDE ATTACK - BeEF Framework Hooking targets using MITMF Tools: MITMF and BeEF Start BeEF and ...
- 二进制图片blob数据转canvas
javascript是有操作二进制文件的方法的,在这里就不详述了. 而AJAX的核心XMLHttpRequest也可以获取服务端给的二进制Blob. 可以参考: XMLHttpRequest Leve ...
- JAVA四大名著(程序员必读)
JAVA四大名著: <JAVA语言程序设计(第4版)>-----初级 <JAVA核心技术>卷I----初级.<JAVA核心技术>卷II----中级 <JAVA ...
- 题解 洛谷 P4189 【[CTSC2010]星际旅行】
一个比较直接的想法就是对每个点进行拆点,拆成入点和出点,限制放在入点和出点相连的边上,然后跑最大费用最大流即可. 但是这样复杂度无法接受,所以考虑模拟费用流来解决本题. 发现 \(H\) 都大于等于该 ...
- python 结合redis 队列 做一个例子
结合redis 队列 做了一个例子 #!/usr/bin/env python # coding: utf-8 # @Time : 2018/12/21 0021 13:57 # @Site : # ...
- Spring事务处理时自我调用
1.预备知识 aop概念请参考[http://www.iteye.com/topic/1122401]和[http://jinnianshilongnian.iteye.com/blog/141859 ...
- Java中包装类Test类测试出错的解决方法(JUnit5)
import org.junit.jupiter.api.Test; public class TestJunit { public static void main(String[]args) { ...
- LQB2013A01高斯日记
诶,今天发生了点不是很开心的事.说实话挺影响心情的啊(谁遇见这种事不生气呢啊啊啊啊) 但是不能水更,还是得好好更新呀. 这个题居然直接用excel哈哈哈哈 那,,就这样吧!
- 一次django内存异常排查
起因 Django 作为 Python著名的Web框架,相信很多人都在用,自己工作中也有项目项目在用,而在最近几天的使用中发现,部署Django程序的服务器出现了内存问题,现象就是运行一段时间之后,内 ...