vue-router中的push与replace学习小记

1,117 阅读1分钟

push的使用

采用push进行页面的跳转会创建一个新的Vue组件,并在history中做新的记录

  • 常见的用法:
this.$router.push('/name');
this.$router.push({
	name:'name',
    params:{}
});
this.$router.push({
	path:'/name',
    query:{}
});

replace的使用

采用replace进行页面的跳转会同样也会创建渲染新的Vue组件,但是在history中其不会重复保存记录,而是替换原有的vue组件;

  • 常见的用法:
this.$router.replace('/name');

push与replace的主要区别:

push跳转会在history中重新创建一条记录, replace跳转不会在history中重复创建,而是覆盖已有的记录,但是两者每次跳转都是会重新渲染组件的;如果在页面间非频繁跳转,建议使用push;如果是父路由中对子路由来回切换建议使用replace,案例:就是tabbar功能条,切换子路由页面,如果使用push,每次切换都有创建一个新组件并保存,那样内存会爆炸的;