vue 获取页面详情后 切换页面时 如何监听用户是否修改过信息
可以用 beforeRouteLeave 和 updated 来判断。export default {
name: 'supplier',
components:{cmtWrap,cmtContent},
props: [],
beforeRouteLeave (to, from, next) {//离开当前页
if(this.updateCount > ){ //更新次数大于1 说明用户修改过当前页数据 因为获取详情时会更新一次
if(from.path.includes('nowPath')){
this.$confirm('即将离开当前页,请确定是否保存当前数据?', '离开当前页', {
confirmButtonText: '保存',
cancelButtonText: '不保存',
type: 'warning'
}).then(() => {
//...todo 这里调接口 保存数据
next()
}).catch(() => {next()});
}else{next()}
}else{
next()
}
},
updated:function () {
this.updateCount = this.updateCount +
},
data() {
return {
updateCount:,//判断用户是否更新当前数据
}
},
computed:{},
watch:{},
mounted:function () {
this.getInitData()
},
methods: {
getInitData:function(){
//...todo 页面进来,先获取默认数据 }
},
}
vue 获取页面详情后 切换页面时 如何监听用户是否修改过信息的更多相关文章
- js中对arry数组的各种操作小结 瀑布流AJAX无刷新加载数据列表--当页面滚动到Id时再继续加载数据 web前端url传递值 js加密解密 HTML中让表单input等文本框为只读不可编辑的方法 js监听用户的键盘敲击事件,兼容各大主流浏览器 HTML特殊字符
js中对arry数组的各种操作小结 最近工作比较轻松,于是就花时间从头到尾的对js进行了详细的学习和复习,在看书的过程中,发现自己平时在做项目的过程中有很多地方想得不过全面,写的不够合理,所以说啊 ...
- SpringMVC拦截器实现:当用户访问网站资源时,监听session是否过期
SpringMVC拦截器实现:当用户访问网站资源时,监听session是否过期 一.拦截器配置 <mvc:interceptors> <mvc:interceptor> < ...
- EditText设置文字改变时的监听
textWatcher = new TextChangeWatcher(); etQuerryInfo.addTextChangedListener(textWatcher); /** * 文字改变类 ...
- 【winform】基于UserControl实现webBrower组件时html页面元素加载及onclick事件监听实现
[背景]基于System.Windows.Forms.UserControl实现的webBrower组件在html内使用window.external调用winform事件失败. [解决思路]借助wi ...
- iframe中,页面转换后回到页面的顶部
看到网上有这样描述的: 现在A页面内分为上下两个部分,上部分是top,下部分分左右,左是treeview右边是iframe,iframe内嵌一个B页面,B页面的内容实质上是个月刊,可以理解为杂志,里面 ...
- 后台自动运行,定期记录定位数据(Hbuilder监听 app由前台切换到后台、切换运行环境的 监听方法)
http://ask.dcloud.net.cn/question/28090 https://blog.csdn.net/qq_37508970/article/details/86649703 各 ...
- vue --》路由query 编程式导航传值与监听
1.首先在一个页面设置一个按钮,用于路由跳转 <template> <div> <button @click="handleToRouter"> ...
- NGUI无法按住鼠标按住时无法监听OnHover事件
UICamera.cs 修改前: if ((!isPressed) && highlightChanged) { currentScheme = ControlScheme.Mouse ...
- 20、解决Vue使用bus兄弟组件间传值,第一次监听不到数据
1.新建bus.js文件: import Vue from 'vue' export default new Vue; 2.在需要通信组件A,B中引入bus: A组件: import Bus from ...
随机推荐
- 手把手教你从零开始搭建SpringBoot后端项目框架
原料 新鲜的IntelliJ IDEA.一双手.以及电脑一台. 搭建框架 新建项目 打开IDE,点击File -> New Project.在左侧的列表中的选择Maven项目,点击Next. 填 ...
- React Native 断点调试 跨域资源加载出错问题的原因分析
写在前面 ————如果从头开始看还没解决,试试文章最后的绝招 闲来无事,折腾了一下React Native,相比之前,开发体验好了不少.但在真机断点调试那里遇到了跨域资源加载出错的问题,一番探索总算解 ...
- 这月薪过万的Java高级学习资料,难得一遇的干货,不下载真可惜了!
大家有没有想我呢 不管你们想不想我 我挺想你们的 通过昨天我不断的 死气白咧各种说好话 最终 要到了Java学科的Java集合学习资料 里面包含视频+资料+源码 堂兄也有一个愿望 希望你们月薪过万后 ...
- [Swift]LeetCode92. 反转链表 II | Reverse Linked List II
Reverse a linked list from position m to n. Do it in one-pass. Note: 1 ≤ m ≤ n ≤ length of list. Exa ...
- [Swift]LeetCode504. 七进制数 | Base 7
Given an integer, return its base 7 string representation. Example 1: Input: 100 Output: "202&q ...
- [Swift]LeetCode740. 删除与获得点数 | Delete and Earn
Given an array nums of integers, you can perform operations on the array. In each operation, you pic ...
- Truncated incorrect DOUBLE value: 'd'的解决方法(jdbc)
今天写jdbc中dao的增删改查时遇到了一个问题,花费了好长时间,不过还好,有我峰哥出头,问题解决了,在这做个分享,对峰哥表达一下感激之情 网上搜索到的对“Truncated incorrect DO ...
- JDK 8u131
JDK 8u131 发布了.Java SE 8u131 包括重要的安全修复和bug修复.Oracle 强烈建议所有 JavaSE 8 用户升级到此版本.此次完整版本号为1.8.0_131-b11. J ...
- 前端基本知识(二):JS的原型链的理解
之前一直对于前端的基本知识不是了解很详细,基本功不扎实,但是前端开发中的基本知识才是以后职业发展的根基,虽然自己总是以一种实践是检验真理的唯一标准,写代码实践项目才是唯一,但是经常遇到知道怎么去解决这 ...
- uWSGI 踩坑记
一.协议的一致性 uWSGI 是在 nginx 后面,所以 nginx 转发请求时的协议要和 uWSGI 监听的协议一致.否则就会出现问题,因为是三者之间的通信,排查起来需要想清楚请求传递的次序: N ...