vue中监听路由参数的变化
在vue项目中,假使我们在同一个路由下,只是改变路由后面的参数值,期望达到数据的更新。
mounted: () =>{
this.id = this.$route.query.id;
this.getdetail()
}
getDetail()方法中会用到this.id这个参数,在同一页面切换id的值,并不会触发vue的声明周期函数。
可以添加路由监听:
watch: {
$route: {
handler() {
this.id = this.$route.query.id;
this.getDetail();
//深度监听,同时也可监听到param参数变化
},
deep: true,
}
}
vue中监听路由参数的变化的更多相关文章
- vue中监听路由参数变化
今天遇到一个这样的业务场景:在同一个路由下,只改变路由后面的参数值, 比如在这个页面 /aaa?id=1 ,在这个页面中点击一个按钮后 跳转到 /aaa?id=2 , 但从“/aaa?id=1”到“ ...
- vue中监听window.resize的变化
我只想说每个人遇到的bug真的不能一概而论,解决办法也会有不同.在vue中使用echarts的时候,会想要实现window.resize窗体变化大小的时候让图形大小跟着变化.实现的过程中各种bug,也 ...
- 在vue中监听storage的变化
1.首先在main.js中给Vue.protorype注册一个全局方法,其中,我们约定好了想要监听的sessionStorage的key值为’watchStorage’,然后创建一个StorageEv ...
- vue中监听数据变化 watch
今天做项目的时候,子组件中数据(原本固定的数据)需要父组件动态传入,如果一开始初始化用到的数据.但当时还没有获取到,初始化结束就不会更新数据了.只有监听这两个属性,再重新执行初始化. 1.watch是 ...
- vue中监听页面滚动和监听某元素滚动
①监听页面滚动 在生命周期mounted中进行监听滚动: mounted () { window.addEventListener('scroll', this.scrollToTop) }, 在方法 ...
- vue 中监听窗口发生变化,触发监听事件, window.onresize && window.addEventListener('resize',fn) ,window.onresize无效的处理方式
// 开始这样写,不执行 window.onresize = function() { console.log('窗口发生变化') } // 改成window监听事件 window.addEventL ...
- vue中监听返回键
问题:在项目中,我们常常有需求,当用户在填写表单时,点击返回的时候,我们希望加一个弹窗,确认离开吗,确认将保存为草稿 解决方案:利用 H5的 pushstate(个人理解为增加页面栈)特性与onpop ...
- 057——VUE中vue-router之路由参数默认值的设置
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 056——VUE中vue-router之路由参数的验证处理保存路由安全
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
随机推荐
- 转:解决Eclipse中.properties文件中文乱码问题
在.properties文件写注释时,发现中文乱码了,由于之前在idea中有见设置.properties文件的编码类型,便找了找乱码原因 在中文操作系统中,Eclipse中的Java类型文件的编码的默 ...
- 洛谷 题解 P3161 【[CQOI2012]模拟工厂】
本蒟蒻又双叒叕被爆踩辣! 题目链接 Solution: 这题又是一道贪心.. 数据范围: n<=15 ti<=100,000 gi<=10^9 mi<=10^9 这里就可以看到 ...
- nmon脚本——对Linux服务器的监控
继服务器被挖之后,我又开拓了另一个监控工具----nmon! Nmon可以很轻松的监控系统的CPU.内存.网络.硬盘.文件系统.NFS.高耗进程.资源和IBM Power系统的微分区的信息,还有专属的 ...
- Java修炼——继承_super父类对象的引用
Super是指直接父类对象的引用,可以通过super来访问父类中被子类覆盖的方法和属性. 当你调用子类的构造方法时,系统会默认给你先调用父类的构造方法,然后才会调用子类的构造方法. package c ...
- POJ 2559 Langest Rectangle in a Histogame
A histogram is a polygon composed of a sequence of rectangles aligned at a common base line. The rec ...
- LightOj-1030 Discovering Gold (期望DP)
You are in a cave, a long cave! The cave can be represented by a 1 x N grid. Each cell of the cave c ...
- 从RTL视图到Verilog语言-转可乐豆原创
从RTL视图到Verilog语言 曾经听过某位大牛都说:“当你的学习FPGA到一个境界的时候,你看到的硬件描述语言,将不再是单纯的语言,而是由一个个逻辑门组成的电路图,一旦达到这个境界,方能把代码写到 ...
- 【Web技术】353- CDN 科普
点击上方"前端自习课"关注,学习起来~ 一.概述 1.1 含义 CDN 的全称是 Content Delivery Network,即内容分发网络.CDN 是构建在网络之上的内容分 ...
- IPV6技术笔记(剖析IPv4toIPv6)
IPV6技术笔记 IPv6地址入门概念 什么是IPv6? IPv6,全称Internet Protocol version 6,即网际协议版本6,也叫互联网通信协议第六版.是互联网工程任务组(IETF ...
- 【玩转SpringBoot】用好条件相关注解,开启自动配置之门
自动配置隐含两层含义,要搞清楚 上帝让程序员的发量减少,是为了让他变得更聪明,如果有一天聪明到了极点,那就是绝顶聪明. 据说在大脑高速运转下,这样更有利于散热,不至于核心温度过高而产生告警. 聪明的大 ...