出现这种情况是因为依赖路由的params参数获取写在created生命周期里面,因为相同路由二次甚至多次加载的关系 没有达到监听,退出页面再进入另一个文章页面并不会运行created组件生命周期,导致文章数据还是第一次进入的数据。

解决方法:watch监听路由是否变化

watch: {
// 方法1
'$route' (to, from) { //监听路由是否变化
if(this.$route.params.articleId){// 判断条件1 判断传递值的变化
//获取文章数据
}
}
//方法2
'$route'(to, from) {
if (to.path == "/page") { /// 判断条件2 监听路由名 监听你从什么路由跳转过来的
this.message = this.$route.query.msg
}
}
}

VUE 路由变化页面数据不刷新问题的更多相关文章

  1. vue 路由变化页面数据不刷新问题(缓存)

    每天记录一点点,把我遇到的问题记录下来, 希望可以帮助到更多和我遇到同样问题的人. 问题描述:通过调接口,动态显示帮助页面的问题列表, 问题列表有多级,当点击的这个问题没有下一级问题的时候跳入内容页. ...

  2. vue项目中返回之前页面数据不刷新的问题

    利用vue做项目的时候会有让用户选择当前页面的某些数据,然后再跳到下一页,而下一页是根据上一页的数据来的,有时候选择了上一页的不同选项,下一页的数据可能还是之前的 这个就属于vue的数据获取问题 解决 ...

  3. Vue-- 监听路由变化,数据无法更新?

    之前写的Vue项目,有个问题困扰了好久.新闻板块有推荐.精华.最新等几个Tab,设想通过切换Tab,改变路由参数(get/news/:tab)去获取对应数据,然后渲染到页面(用的是同一套组件),问题来 ...

  4. vue 路由更新页面视图未更新问题

    最近项目做面包屑的时候遇到一个问题就是路由变化的时候页面视图并没有发生变化,后来上网查,发现是vue-router的特性导致的. vue-router的切换不同于传统的页面的切换.路由之间的切换,其实 ...

  5. VUE路由新页面打开的方法总结

    平常做单页面的场景比较多,所以大部分的业务是在同一个页面进行跳转.要通过VUE路由使用新页面打开且传递参数,可以采用以下两个方法: 1.router-link的target <router-li ...

  6. 【问题】VUE 同一页面路由参数变化,数据不刷新

    依赖路由的params参数获取写在created生命周期里面,因为相同路由二次甚至多次加载的关系 没有达到监听,退出页面再进入另一个页面并不会运行created组件生命周期,导致数据还是第一次进入的数 ...

  7. vue data数据变化 页面数据不更新问题

    问题: <template> <div class="container"> <div v-for="(item, index) in ar ...

  8. vue路由在keep-alive下的刷新问题 对watch的影响

    转载自:https://www.cnblogs.com/dansingal/p/8302100.html 问题描述: 在keep-alive中的在跳转到指定的路由时刷新对应的路由,其余不刷新. 1 2 ...

  9. vue路由在keep-alive下的刷新问题

    问题描述: 在keep-alive中的在跳转到指定的路由时刷新对应的路由,其余不刷新. <transition name="fade" mode="out-in&q ...

随机推荐

  1. 解决报错DEFAULT_INCOMPATIBLE_IMPROVEMENTS

    freemarker整合springMVC报错如下:警告: Exception encountered during context initialization - cancelling refre ...

  2. FreeBSD利用 ports 來安裝軟體

    FreeBSD利用 ports 來安裝軟體   利用 ports 來安裝軟體 FreeBSD 的 ports 就是別人已經編譯過,安裝測試沒問題了,他們將軟體編譯時所需的組態設定.編譯程序及安裝程序, ...

  3. home.php

    home.php <?php error_reporting(0); //抑制所有错误信息 @header("content-Type: text/html; charset=utf- ...

  4. 2017-3-01 test

    三道好像都是HDU上的题QAQ 题目名称都没改,差评 T1:http://acm.hdu.edu.cn/showproblem.php?pid=5073 被卡精度了QAQ 先排一发序,然后发现最后未动 ...

  5. react自定义组件属性类型检测

    react当中的props-type用来检测传入组件当中的数据是否符合组件的要求,但是之前的只是能做些简单常规的判断,如果需要做复杂的判断,就需要使用到自定义函数来做类型检测了. 下面是官网的例子 c ...

  6. Java语法糖(二)

    语法糖之四:内部类 内部类:顾名思义,在类的内部在定义一个类.内部类仅仅是编译时的概念,编译成字节码后,内部类会生成单独的Class文件. 四种:成员内部类.局部内部类.匿名内部类.静态内部类. 1. ...

  7. 【BZOJ4477】字符串树(可持久化Trie)

    此题花费我整整三天的功夫.还在NoiP贴吧发过贴. 最后发现trie树建新节点时信息未完全复制,真是愚蠢之极. 言归正传. 如果我们已经知道了每个点上的trie树那么询问就是sum[x]+sum[y] ...

  8. 在android app中使用STL库(转)

    1.在jni目录下新建Application.mk; 加入 APP_STL := stlport_static右边的值还可以换成下面几个: system - 使用默认最小的C++运行库,这样生成的应用 ...

  9. 7天学习opengl入门

    http://blog.csdn.net/slience_perseverance/article/details/8096233 10月13号下午3:00队长给我开了一个会,10.14号开始学习op ...

  10. hdu 4990(数学,等比数列求和)

    Reading comprehension Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Ot ...