如何让vue-router修改路由但是不刷新页面？

Question

vuejs搭建的单页面应用中，我有以下的特殊需求：

点击页面中一个按钮，在当前url后面加个标识，
比如原来路由是：
http://127.0.0.1:3000/,
点击按钮后路由变为
http://127.0.0.1:3000/?tab=2，
但是页面不能刷新。

路由历史记录中
http://127.0.0.1:3000/
要被
http://127.0.0.1:3000/?tab=2替换掉。

怎么做呢？不会呀。求大神给指明思路。

Answer 1

楼主，你好！其实这个要看你的使用场景，或许有其他的解决方案。目测你要实现的功能可能是，通过 url 地址的参数来控制页面的 tab 的选中。可选的方案，storage, vuex 等

Answer 2

$router.replace()

Answer 3

this.$router.replace('?tab=2')

Answer 4

要不刷新页面要使用vue的：keep-alive

Answer 5

咦 vue-router push到当前页面本来就不会刷新页面呀，你可以加参数，只会修改url。~~

Answer 6

可以试一下location.hash，会在当前url后面加上#开头的字符串，而且在路由历史记录中会替换掉当前的路由

Answer 7

history.pushState()

Answer 8

你应该是给组件加了KEY，key 值不一样就会刷新网页。正常push到同个页面是不会刷新的。