转自:https://juejin.im/post/593121aa0ce4630057f70d35  

问题的根源: 用户点击当前高亮的路由并不会刷新view,因为vue-router会拦截你的路由,它判断你的url并没有任何变化,所以它不会触发任何钩子或者是view的变化(这是vue设计的一个原则:一切都是从路由出发的)

  现实: 点击当前路由,改变视图是很多开发人员的“硬需求”

  解决方案:

    

clickLink(path) {
this.$router.push({
path,
query: {
t: +new Date() //保证每次点击路由的query项都是不一样的,确保会重新刷新view
}
})
}

  弊端:url 后面有一个很难看的 query 后缀如 xxx.com/article/list?t=1496832345025

Vue--关于点击当前路由,视图无法更新的解决方案的更多相关文章

  1. vue修改elementUI的分页组件视图没更新问题

    转: vue修改elementUI的分页组件视图没更新问题 今天遇到一个小问题平时没留意,el-pagination这个分页组件有一个属性是current-page当前页.今天想在methods里面手 ...

  2. vue中修改了数据但视图无法更新的情况[转载]

    我们有时候常碰到vue中明明修改了数据,但是视图无法更新,因此我总结了一点点碰到此类的情况: 1.v-for遍历的数组,当数组内容使用的是arr[0].xx =xx更改数据,vue无法监测到 数组数据 ...

  3. vue中修改了数据但视图无法更新的情况

    数组数据变动:我们使用某些方法操作数组,变动数据时,有些方法无法被vue监测,有些可以 Vue包装了数个数组操作函数,使用这些方法操作的数组去,其数据变动时会被vue监测: push() pop() ...

  4. vue数组中数据变化但是视图没有更新解决方案

    原文链接:http://www.cnblogs.com/sufubo/p/6906261.html#undefined 问题:在vue项目中,我更改数组中的某一条数据,直接arr[i]=newVal ...

  5. vue中修改了数据但视图无法更新的情况(转)

    原文地址:https://blog.csdn.net/qq_39985511/article/details/79778806

  6. vue项目创建步骤 和 路由router知识点

    菜单快捷导航: vue项目创建 vue路由router知识点(路径参数.查询参数.命名路由.嵌套路由.命名视图.hash/history模式) 1.创建一个vue项目步骤 (windows环境下).创 ...

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

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

  8. vue 路由视图,router-view嵌套跳转

    实现功能:制作一个登录页面,跳转到首页,首页包含菜单栏.顶部导航栏.主体,标准的后台网页格式.菜单栏点击不同菜单控制主体展示不同的组件(不同的页面). 配置router-view嵌套跳转需要准备两个主 ...

  9. Vue-初步了解vue-router的三要素:路由map 、路由视图、路由导航

    安装vue-router模块 使用vue-router前要先安装vue-router库 cnpm install vue-router –save 使用vue-router vue-router有三个 ...

随机推荐

  1. JDBC批量插入数据优化,使用addBatch和executeBatch

    JDBC批量插入数据优化,使用addBatch和executeBatch SQL的批量插入的问题,如果来个for循环,执行上万次,肯定会很慢,那么,如何去优化呢? 解决方案:用 preparedSta ...

  2. 20165310_Exp2实验二《Java面向对象程序设计》

    实验二<Java面向对象程序设计> TDD与单元测试 前期准备: 什么是单元测试? 单元测试(unit testing),是指对软件中的最小可测试单元进行检查和验证.对于单元测试中单元的含 ...

  3. C# 获取枚举的描述属性

    在使用枚举类型时,我们需要取名称和值,甚至有时候还需要取枚举类型的描述.通过反射,我们能获取到枚举类型的描述属性. 首先我们需要给枚举类型添加描述属性(属性都没有是不可能取到的),[Descripti ...

  4. 【配置、开发】Spark入门教程[2]

    本教程源于2016年3月出版书籍<Spark原理.机制及应用> ,在此以知识共享为初衷公开部分内容,如有兴趣,请支持正版书籍. Spark为使用者提供了大量的工具和脚本文件,使得其部署与开 ...

  5. 【概念、概述】Spark入门教程[1]

    本教程源于2016年3月出版书籍<Spark原理.机制及应用> ,如有兴趣,请支持正版书籍. 随着互联网为代表的信息技术深度发展,其背后由于历史积累产生了TB.PB甚至EB级数据量,由于传 ...

  6. [不屈的复习] - 编辑工具IDE选取与Hello World

    大家真正在工作中开发 java 应用都会使用eclipse,myeclipse, IntelliJ IDEA等等 现在还有vscode也支持了java扩展 在控制台下运行第一个Java程序,可以看到输 ...

  7. 配置caffe中出现的问题汇总

    1,运行下面代码时: sudo apt-get install libopencv 出错: E: 无法修正错误,因为您要求某些软件包保持现状,就是它们破坏了软件包间的依赖关系 原因: 源(source ...

  8. js delete可以删除对象属性及变量

    ,对象属性删除 function fun(){ this.name = 'mm'; } var obj = new fun(); console.log(obj.name);//mm delete o ...

  9. Remastersys -- 将正在使用的Ubuntu14.04 制作成镜像文件

    remastersys 是一个能够备份你的ubuntu系统的工具. 源码在github上能找到:Remastersys Source 另外系统是 Ubuntu14.04/12.04 也可以直接 apt ...

  10. JavaScript页面跳转的一些实现方法

    第一种 <script language=”javascript” type=”text/javascript”> window.location.href=”login.jsp?back ...