ARTICLE DETAIL

建站实战干货

来自一线的建站与推广经验沉淀,每一条都经过真实交付验证。

Vue2:router-link的replace属性

2026/9/20 22:49:42 拓冰建站 浏览量
Vue2:router-link的replace属性

一、情景说明
我们在用浏览器访问网站的时候
知道浏览器会记录访问的历史路径,从而,可以退回到之前的页面
那么,Vue项目中的路由组件,通过router-link跳转,也是可以退回的

这里,我们用replace来屏蔽退回的router-link
让回退按钮,无法返回到上一次访问到router-link跳转的组件

浏览器的历史记录有两种写入方式:
分别为pushreplace
push是追加历史记录
replace是替换当前记录。
路由跳转时候默认为push

二、案例
开启replace模式:给router-link添加replace属性即可

<router-link replace class="list-group-item" active-class="active" to="/about">About</router-link>