vue-router同路由$router.push不跳转一个简单解决方案

vue-router跳转一般是这么写:

toCurrentPage: function(thisId){
this.$router.push({path:'/test ', query: { id: thisId, option: ""}});
}
但是当遇到,需要跳转同页面不同query的情况,上面的方法不起作用。当然了,从性能来说,理论上这种情况最佳的解决方案,是把需要刷新的包裹成一个init function,跳转的方法,传参再次调用init方法。balabalabala……不在赘述。

但是另一些情况,基本页面所有组件都需要刷新,再次加载对开销影响不大,需要history.back以保证操作逻辑顺畅……我们只要跳转加载如此而已,那么其实也很简单,只需在上述方法基础上加上:

watch: {
  '$route' (to, from) {
  this.$router.go(0);
  }
},
监视router变化,刷新页面, 233333333333
---------------------
作者:wulala_orz
来源:CSDN
原文:https://blog.csdn.net/wulala_orz/article/details/78928524?utm_source=copy
版权声明:本文为博主原创文章,转载请附上博文链接!

转自:https://blog.csdn.net/wulala_orz/article/details/78928524?utm_source=copy

vue-router同路由$router.push不跳转一个简单解决方案的更多相关文章

  1. vue router.push(),router.replace(),router.go()和router.replace后需要返回两次的问题

    转载:https://www.cnblogs.com/lwwen/p/7245083.html https://blog.csdn.net/qq_15385627/article/details/83 ...

  2. vue 中router.go;router.push和router.replace的区别

    vue 中router.go:router.push和router.replace的区别:https://blog.csdn.net/div_ma/article/details/79467165 t ...

  3. vue中router.go、router.push和router.replace的区别

    router.go(n) 这个方法的参数是一个整数,意思是在history记录中向前或者后退多少,类似window.history.go(n) router.push(location) 想要导航到不 ...

  4. vue 中router.go、router.push和router.replace的区别

    router.go(n) 这个方法的参数是一个整数,意思是在 history 记录中向前或者后退多少步,类似 window.history.go(n) router.push(location) 想要 ...

  5. vue router动态路由

    <div id="#app"> <router-link to="/user/header">路由1</router-link&g ...

  6. vue中$route 和$router的区别

    在vue中会出现一种情况 const url=this.$route.query.returnURL; this.$router.push(url);    $router和$route的区别傻傻的分 ...

  7. vue & this.$route & this.$router

    vue & this.\(route & this.\)router const User = { template: '<div>User</div>' } ...

  8. vue工程化与路由router

    一.介绍     vue.js 是 目前 最火的前端框架,vue.js 兼具 angular.js 和 react.js 的优点,并剔除它们的缺点.并且提供了很多的周边配套工具 如vue-router ...

  9. vue中的路由

           路由配置项:        import Router from ‘vue-router’                          1.path:路径              ...

随机推荐

  1. DotNetCore 部署到IIS 上

    将 DotNetCore MVC 项目成功部署到 IIS 上,记录下配置要点: 1.在 ASP.NET Core 应用中使用 Kestrel Microsoft.AspNetCore.App 元包中包 ...

  2. 《Whitelabel Error Page 404》 对于Springboot初学者可能出现问题的原因

    whitelabel error page异常一定是有原因的,比如,访问路径不对,解析不对,注解忘记引入等.对于初学者,一定要注意一点,程序只加载Application.java所在包及其子包下的内容 ...

  3. 关于富文本编辑器—UEditor(java版)的使用,以及如何将UEditor的文件/图片上传路径改成绝对路径

    突然发现好久没写博客了,感觉变懒了,是要让自己养成经常写文章的习惯才行.既可以分享自己的所学,和所想,和大家一起讨论,发现自己的不足的问题. 大家可能经常会用到富文本编辑器,今天我要说的是UEdito ...

  4. redis的数据持久化策略

    redis提供了两种不同的持久化方法来将数据存储到硬盘里面.一种方法叫快照,它可以将存在于某一时刻的所有数据都写入硬盘里面.另一种方法叫只追加文件(AOF),它会在执行写命令时,将被执行的写命令复制到 ...

  5. Automatically populating $HTTP_RAW_POST_DATA is deprecated......

    Automatically populating $HTTP_RAW_POST_DATA is deprecated... 1 这个问题和PHP版本有关系,PHP 5.6已经废弃了$HTTP_RAW_ ...

  6. COMS3200 The RUSH protocol

    Part C (50 marks)The RUSH protocol (Reliable UDP Substitute for HTTP) is a HTTP-like stop-and-wait p ...

  7. 骨灰级玩家体验带你测试体验天使纪元OL折扣端

    刘亦菲代言吸引了我才进入游戏的(不知道有多少人和我一样)这个游戏没有一些骨灰级玩家带,真的很费时间费钱.   天使纪元5折折扣端(点击下载),其实是一个良心老平台,苹果,安卓.H5都支持的平台,采用最 ...

  8. Bootstrap3基础 栅格系统 1行最多12列

      内容 参数   OS   Windows 10 x64   browser   Firefox 65.0.2   framework     Bootstrap 3.3.7   editor    ...

  9. mongodb常用查询语句

    1.查询所有记录db.userInfo.find();相当于:select* from userInfo; 2.查询去掉后的当前聚集集合中的某列的重复数据db.userInfo.distinct(&q ...

  10. EvansClassification

    EvansClassification In his excellent book Domain Driven Design, Eric Evans creates a classification ...