vue 路由变化页面数据不刷新问题(缓存)
每天记录一点点,把我遇到的问题记录下来, 希望可以帮助到更多和我遇到同样问题的人。
问题描述:通过调接口,动态显示帮助页面的问题列表, 问题列表有多级,当点击的这个问题没有下一级问题的时候跳入内容页。
问题出在,我在电脑上做移动端页面的时候,相继跳到详情页,我想返回,点击
按钮,直接跳转到了如上第一张图的样子,no,no,no,这不是我想要的结果,此刻,想到了通过改变url来改变页面的层级问题。
一级的parent为0,默认不显示或显示为如图:
二级的parent为1,点击一级路由变为如图:
点击进入下一级页面的时候,数据会刷新,但是点击电脑后退时,url最后的parent变为1了,页面还显示2的数据,
解决办法如下:
created () {
console.log(this.getStatus(this.$route.path))
},
watch: {
'$route' (to, from) {
console.log(this.getStatus(this.$route.path))
}
},
methods: {
getStatus (urlStr) {
var urlStrArr = urlStr.split('/')
return urlStrArr[urlStrArr.length - 1]
}
},
vue 路由变化页面数据不刷新问题(缓存)的更多相关文章
- VUE 路由变化页面数据不刷新问题
出现这种情况是因为依赖路由的params参数获取写在created生命周期里面,因为相同路由二次甚至多次加载的关系 没有达到监听,退出页面再进入另一个文章页面并不会运行created组件生命周期,导致 ...
- vue项目中返回之前页面数据不刷新的问题
利用vue做项目的时候会有让用户选择当前页面的某些数据,然后再跳到下一页,而下一页是根据上一页的数据来的,有时候选择了上一页的不同选项,下一页的数据可能还是之前的 这个就属于vue的数据获取问题 解决 ...
- Vue-- 监听路由变化,数据无法更新?
之前写的Vue项目,有个问题困扰了好久.新闻板块有推荐.精华.最新等几个Tab,设想通过切换Tab,改变路由参数(get/news/:tab)去获取对应数据,然后渲染到页面(用的是同一套组件),问题来 ...
- vue路由在keep-alive下的刷新问题 对watch的影响
转载自:https://www.cnblogs.com/dansingal/p/8302100.html 问题描述: 在keep-alive中的在跳转到指定的路由时刷新对应的路由,其余不刷新. 1 2 ...
- vue路由在keep-alive下的刷新问题
问题描述: 在keep-alive中的在跳转到指定的路由时刷新对应的路由,其余不刷新. <transition name="fade" mode="out-in&q ...
- vue 路由更新页面视图未更新问题
最近项目做面包屑的时候遇到一个问题就是路由变化的时候页面视图并没有发生变化,后来上网查,发现是vue-router的特性导致的. vue-router的切换不同于传统的页面的切换.路由之间的切换,其实 ...
- VUE路由新页面打开的方法总结
平常做单页面的场景比较多,所以大部分的业务是在同一个页面进行跳转.要通过VUE路由使用新页面打开且传递参数,可以采用以下两个方法: 1.router-link的target <router-li ...
- 微信小程序之页面传值(路由、页面栈、globalData、缓存)
1. 通过url带参数传递 1.1 固定参数传递 例如,从 list 页面到 detail 页面, 传递一个或多个固定值 list页面传值: <!--pages/list/list.js--&g ...
- 【问题】VUE 同一页面路由参数变化,数据不刷新
依赖路由的params参数获取写在created生命周期里面,因为相同路由二次甚至多次加载的关系 没有达到监听,退出页面再进入另一个页面并不会运行created组件生命周期,导致数据还是第一次进入的数 ...
随机推荐
- C#2.0之细说泛型
C#2的头号亮点 : 泛型 在C#1中,Arraylist总是会给人带来困扰,因为它的参数类型是Object,这就让开发者无法把握集合中都有哪些类型的数据.如果对string类型的数据进行算术操作那自 ...
- shell初识
今天写blog才发现以前还有没写起的,我的天,我是睡着了么... 1,什么是shell? shell是unix/Linux系统的一个用充当内核与用户之间的接口的软件,它读取用户的输入命令,发送给内核让 ...
- 浅析java程序的执行过程
在研究任何一门语言时,无论是面向过程的c,c++(面向过程和面向对象),还是面向对象的.net,java等,弄清语言执行过程至关重要. 何为语言执行过程? 所谓语言执行过程,指对于任何一门语言,如j ...
- Java8之Optional类
写在前头 今天再看阿里的Java开发手册,里面异常处理第10条提到这样一个建议. [推荐]防止 NPE ,是程序员的基本修养,注意 NPE 产生的场景:1 ) 返回类型为基本数据类型,return 包 ...
- nginx基础
常见的能够提供web服务的程序有apache.IIS,nginx等,LLS是windows系统中的,nginx和apache是linux系统中的,nginx是一款高性能的http和反向代理的服务器. ...
- 为你的Python程序加密
在实际的工作中,有时候我们需要部署自己的Python应用,但这时候我们并不希望别人能够看到自己的Python源程序.因此,我们需要为自己的源代码进行加密,Python已经为我们提供了这样一套工作机 ...
- BOM简单知识
JS分为ECMAScript,DOM,BOM BOM是用来和浏览器进行‘’对话‘’的 一:与window对象进行交互: 1.查看用户信息: window.navigator.userAgent; 可以 ...
- vue中computed计算属性与methods对象中的this指针
this 指针问题 methods与computed中的this指针 应该指向的是它们自己,可是为什么this指针却可以访问data对象中的成员呢? 因为new Vue对象实例化后data中的成员和c ...
- Vs2017 xaramin mac build agent部署后记
换了四种黑苹果,最终成功了 步骤: 1.升级vs2017, 2.安装XCODE 8.3 3.安装vs2017 for mac 企业版 4 ...
- 转载:Linux服务器Cache占用过多内存导致系统内存不足最终java应用程序崩溃解决方案
原文链接: https://blog.csdn.net/u014740338/article/details/66975550 问题描述 Linux内存使用量超过阈值,使得Java应用程序无可用内存, ...