应用场景:
例如:页面上有多个tab,点击不同的tab,跳转到不同的页面上去,再次返回的时候,需要知道上次点击的是哪个tab,这样不用存缓存,直接改路由参数,然后直接返回就可以了;

用法如下:

import merge from 'webpack-merge';

//如果路由没有参数name,就新增一个参数,如果有的话,就是修改name的值
//可以修改多个参数
this.$router.push({
    query:merge(this.$route.query,{'name':'小米'})
});

this.$router.replace({
  query: merge(this.$route.query, {'name':'小米'})
});

this.$router.push({
   query: merge(this.$route.query, {
     'name': '小米',
     'age':'9'
   })
 });
 
this.$router.replace({
   query: merge(this.$route.query, {
     'name': '小米',
     'age':'9'
   })
 });

//替换所有的参数
this.$router.push({
    query:merge({},{'name':'小米'})
}) 

this.$router.replace({
    query:merge({},{'name':'小米'})
}) 

replace()和push() 的区别:

1. this.$router.push() 
描述:此方法会向history栈添加一个记录,返回this.$router.back()会返回到上一个页面。

2.this.$router.replace() 
描述:此方法不会向history里面添加新的记录,返回this.$router.back()会直接跳转到上上一个页面。
Logo

前往低代码交流专区

更多推荐