一定要看下函数前的注释, 需要在使用的页面定义【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的更多相关文章

  1. JavaScript当离开页面时可以进行的操作

    当JavaScript离开页面时可以进行的操作 window.onbeforeunload = function() { var email = document.getElementById(&qu ...

  2. vue进入页面时不在顶部,检测滚动返回顶部按钮

    这里是本小白使用时遇到的问题及个人使用的方法可能并不完美. 1.监测浏览器滚动条滚动事件及滚动距离 dmounted() { window.addEventListener("scroll& ...

  3. Jquery判断离开页面时,通过Ajax更新数据(兼容IE,Chrome,FF浏览器)

    现在很多项目都有客户离开网页时,处理一些业务的需求.所以焦点就聚集在了如何获取页面离开事件. 以下是本人在一个项目中需要记录页面浏览时长的处理办法,测试兼容IE,Chrome,FF浏览器 代码如下: ...

  4. Jquery关闭离开页面时提醒

    [导读] 离开页面提示多般是放到了发新闻或写日志的页面,我们在百度空间或QQ空间在我们未保存信息时如果离开页面都有提示了,下面我来介绍利用jquery的beforeunload来实现此方法. jque ...

  5. Vue切换页面时中断axios请求

    一.概述 在Vue单页面开发过程中,遇到这样的情况,当我切换页面时,由于上一页面请求执行时间长,切换到该页面时,还未执行完,这时那个请求仍会继续执行直到请求结束,此时将会影响页面性能,并且可能对现在页 ...

  6. vue离开页面销毁定时器

    beforeDestroy() { if(this.timer) { clearInterval(this.timer); //关闭 }  //利用vue的生命周期函数 vue 是单页面应用,路由切换 ...

  7. vue离开页面销毁滚动事件

    methods:{ handleFun(){    /**销毁处理*/ } }, beforeDestroy(){ window.removeEventListener("scroll&qu ...

  8. 【原】js离开页面执行函数 onbeforeunload与onunload事件

    在最近的项目中,需要做到一个时间,就是用户离开页面的时候,我需要缓存页面其中一部分的内容,但是我不需要用户刷新的时候也缓存,我只希望在我用户离开的时候 执行这个函数.百度之,有onbeforeunlo ...

  9. js捕捉IE窗口失去焦点事件,判断离开页面刷新或关闭的方法

    js捕捉IE窗口失去焦点事件,判断离开页面刷新或关闭的方法 javascript如何捕捉IE窗口失去焦点事件window.onblur = function(e) { //you code}; 弹框的 ...

随机推荐

  1. Ethical Hacking - GAINING ACCESS(18)

    CLIENT SIDE ATTACKS Backdooring ANY file Combine backdoor with any file - Generic solution. Users ar ...

  2. OSCP Learning Notes - Buffer Overflows(4)

    Finding the Right Module(mona) Mona Module Project website: https://github.com/corelan/mona 1. Downl ...

  3. echarts 实战 : 想让图例颜色和元素颜色对应,怎么办?

    首先,在 series 里设置颜色. (我是用js生成 echarts 需要的option对象,所以可能很难看懂) normalData.sData.forEach((item, index) =&g ...

  4. Pull后产生多余的log(Merge branch 'master' of ...)

    第一步: git reset --hard 73d0d18425ae55195068d39b3304303ac43b521a 第二步: git push -f origin feature/PAC_1 ...

  5. https://blog.csdn.net/yongchaocsdn/article/details/53355296

    https://blog.csdn.net/yongchaocsdn/article/details/53355296

  6. laravel开发调试工具laravel-debugbar的安装

    一.使用 Composer 安装该扩展包 composer require barryvdh/laravel-debugbar --dev 二.(可选)修改配置文件app/config.php Lar ...

  7. Spring JPA实现增删改查

    1. 创建一个Spring工程 2.配置application文件 spring.datasource.driver-class-name= com.mysql.cj.jdbc.Driver spri ...

  8. 报错:invalid operands to binary - (have ‘int’ and ‘char *’)

    //这个题是输入大写的一串字符,然后按A对应1...这个规律求乘积 char a[],b[]; scanf("%s",a); scanf("%s",b); in ...

  9. Python字符串内建函数_下

    Python字符串内建函数: 1.join(str) : 使用调用的字符串对 str 进行分割,返回值为字符串类型 # join(str) : # 使用调用的字符串对 str 进行分割. strs = ...

  10. pandas_数据拆分与合并

    import pandas as pd import numpy as np # 读取全部数据,使用默认索引 data = pd.read_excel(r'C:\Users\lenovo\Deskto ...