Vue2:router-link的replace属性

一、情景说明

我们在用浏览器访问网站的时候

知道浏览器会记录访问的历史路径,从而,可以退回到之前的页面

那么,Vue项目中的路由组件,通过router-link跳转,也是可以退回的

这里,我们用replace来屏蔽退回的router-link

让回退按钮,无法返回到上一次访问到router-link跳转的组件

浏览器的历史记录有两种写入方式:

分别为pushreplace
push是追加历史记录
replace是替换当前记录。

路由跳转时候默认为push

二、案例

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

html 复制代码
<router-link replace class="list-group-item" active-class="active" to="/about">About</router-link>
相关推荐
kyriewen9 小时前
我手写了一个 EventEmitter,面试官追问了 6 个问题——第 4 个我没答上来
前端·javascript·面试
IT_陈寒9 小时前
Java的Date类又坑了我一次,改用时间戳真香
前端·人工智能·后端
山河木马10 小时前
矩阵专题2-怎么创建视图矩阵(uViewMatrix)
javascript·webgl·计算机图形学
小林攻城狮10 小时前
使用 Transport 节流解决 Vercel AI SDK 流式渲染卡死问题
前端·react.js
前端缘梦10 小时前
告别 TS 运行时类型漏洞!Zod 完整入门实战教程(前端 / 全栈必备)
前端·react.js·全栈
the_answer10 小时前
Webpack vs Vite 深度对比分析
前端·webpack
转转技术团队11 小时前
验证码识别实战:前端不写页面,改训模型了?
前端
MomentYY11 小时前
Temperature:AI 的“脑洞旋钮”
前端·llm·ai编程
远航_11 小时前
OpenSpec 完整详细介绍
前端·后端
召钱熏11 小时前
状态枚举正确≠渲染正确:一个语音按钮的状态机边界修复实录
android·前端