vue中监听路由参数变化
今天遇到一个这样的业务场景:在同一个路由下,只改变路由后面的参数值,
比如在这个页面 /aaa?id=1 ,在这个页面中点击一个按钮后 跳转到 /aaa?id=2 ,
但从“/aaa?id=1”到“ /aaa?id=2”是不会触发vue的生命周期的,id变了,但页面数据不会更新,
想要更新只能重新加载页面(手动刷新),但是这多么low、孬呀,
作为一名追求极致用户体验的开发,怎么能容忍这种情况发生;
然后就想办法监听路由参数的变化呀,在watch里监听$route和路由参数,代码如下:
watch: {
$route(){
this.userId= this.$route.query.id
},
userId() {
console.log("重新请求" + this.userId + "的数据")
}
},
OK了
vue中监听路由参数变化的更多相关文章
- vue中监听路由参数的变化
在vue项目中,假使我们在同一个路由下,只是改变路由后面的参数值,期望达到数据的更新. mounted: () =>{ this.id = this.$route.query.id; this. ...
- 在vue中监听storage的变化
1.首先在main.js中给Vue.protorype注册一个全局方法,其中,我们约定好了想要监听的sessionStorage的key值为’watchStorage’,然后创建一个StorageEv ...
- vue同一个路由,但参数发生变化,页面不刷新的问题(vue监听路由参数变化重新渲染页面)
watch: { $route: function(newVal, oldVal) { console.log(oldVal); //oldVa 上一次url console.log(newVal); ...
- vue mounted中监听div的变化
vue mounted中监听div的变化 <div style="width:200px;height:30px;background: #0e90d2" id=" ...
- angular的路由和监听路由的变化和用户超时的监听
先看两篇博客:http://camnpr.com/javascript/1652.html 这一篇博客是重点中的重点: http://www.tuicool.com ...
- 详解Vue 如何监听Array的变化
详解Vue 如何监听Array的变化:https://www.jb51.net/article/162584.htm
- vue中监听window.resize的变化
我只想说每个人遇到的bug真的不能一概而论,解决办法也会有不同.在vue中使用echarts的时候,会想要实现window.resize窗体变化大小的时候让图形大小跟着变化.实现的过程中各种bug,也 ...
- ionic 监听路由事件变化
(function(){ angular.module("cakeStore", ["ngRoute", "ionic","coo ...
- vue监听路由的变化,跳转到同一个页面时,Url改变但视图未重新加载问题
引入:https://q.cnblogs.com/q/88214/ 解决方法: 添加路由监听,路由改变时执行监听方法 methods:{ fetchData(){ console.log('路由发送变 ...
随机推荐
- C# Arcgis Engine 获得鼠标按下位置的要素
public IFeature GetFeatureOnMouseDown(IPoint point) { try { ILayer layer = Common.GetLayerByName(mMa ...
- Android开发系列(十六):【Android小游戏成语连连看】第二篇
写的晚了,在分工个Z市高中的一个成绩查询的系统,原系统居然是用VB写的,我不得不佩服原本写系统的那位哥们真能耐得住. 明天搭建下SVN就等着先发project款然后開始项目了.想想有工资进账,心里也为 ...
- spring set注入
上篇文章说到了构造器注入.可是有时候构造器注入并非非常好用,如今来看下set注入. 构造器注入博客地址:http://blog.csdn.net/luckey_zh/article/details/4 ...
- wifidog用php实现验证流程
原创性声明 此博文的出处 为 http://blog.csdn.net/zhujunxxxxx/article/details/25384909假设进行转载请注明出处.本文作者原创,邮箱zhujunx ...
- ASP.Net MVC默认目录结构
1.Controllers 保存处理URL请求的Controller类 2.Models 保存操纵业务与数据对象的类 3.Views 保存UI模板页面 4.Scripts 保存Javascript库文 ...
- android学习笔记五。1、Service深入学习
一.Service,服务是没有界面而在后台长期运行的程序,可以看做是后台的Activity. 1.在Android中按返回键退出一个应用并不会(内存充足时)直接销毁一个进程,所以其中的子线程也可以在后 ...
- Java:异常体系
异常的类别:可处理异常,运行时异常,非运行时异常 子类重写父类方法,父类方法有异常抛出, 子类重写父类的方法? 不能比父类抛出更大的异常 前言:java 中的异常处理机制你真的理解了吗?掌握了吗?ca ...
- 【2017 Multi-University Training Contest - Team 2】 Is Derek lying?
[Link]: [Description] 两个人都做了完全一样的n道选择题,每道题都只有'A','B','C' 三个选项,,每道题答对的话得1分,答错不得分也不扣分,告诉你两个人全部n道题各自选的是 ...
- [Android] 图像各种处理系列文章合集
这是我近期在做Android随手拍一个项目的各种网上关于图片处理的资料,曾经学过数字图像处理都是用C++写的,以下的资料个人觉得是很优秀的各种集合,还有一方面它是在线笔记,希望对大家有所帮助吧 ...
- Java遍历目录下全部文件并替换指定字符串
应用场景:比方有一个深层次的文件目录结构,如:javaAPI 每一个文件中面都有同样的内容,而我们要统一改动为其它内容.上千个文件假设一个个改动显得太不明智. import java.io.Buffe ...