vue之001-基本工作上遇到的问题:监听页面是否在刷新操作

ini 复制代码
## 前言:大家可能会遇到一个这样的问题,在监听页面中,是否有(如刷新,关闭等操作),刚好遇到有此类项目上的问题!!
### 问题:遇到了一个场景,当在浏览器(pc)上面按f5之类刷新 页面时,如果底部的tarbbar是自定义的话,会回到默认的第1个,解决方案如下:
[ vue-router的beforeRouteEnter的文档说明 ]([导航守卫 | Vue Router (vuejs.org)](https://router.vuejs.org/zh/guide/advanced/navigation-guards.html#%E8%B7%AF%E7%94%B1%E7%8B%AC%E4%BA%AB%E7%9A%84%E5%AE%88%E5%8D%AB))

```
//利用vuerouter中的api方法监听页面是否在刷新操作

beforeRouteEnter(to, from, next) {
    next(vm = >{
        vm.tabbarList.filter((item, index) = >{
            if (item.path === to.fullPath) {
                vm.currentItem = index vm.currentPath = to.fullPath
            }
        })
    })
},

```
### 注意: 注意:在beforeRouteEnter中,无法直接使用this方法,如果使用,则报错,请在next()方法中传入一个参数,去处理vue实例中的变量,方法等,解决方案就在上面的代码中。


#### 结束:记录下,以方便自己和遇到此类问题的朋友(大佬可以略过)
相关推荐
万少18 小时前
Vibe Coding不停歇,移动端 TRAE SOLO 让你用手机也能编程啦
前端·javascript·后端
kyriewen1119 小时前
WebAssembly:前端界的“外挂”,让C++代码在浏览器里跑起来
开发语言·前端·javascript·c++·单元测试·ecmascript
烛衔溟20 小时前
TypeScript 接口的基本使用 —— 定义对象形状
前端·javascript·typescript
铁皮饭盒20 小时前
成为AI全栈 - 第3课:路由 RESTful Elysia 状态码 设计规范
前端·后端·全栈
顾昂_20 小时前
Web 性能优化完全指南
前端·面试·性能优化
前端程序媛-Tian21 小时前
前端 AI 提效实战:从 0 到 1 打造团队专属 AI 代码评审工具
前端·人工智能·ai
支付宝体验科技21 小时前
Ant Design Pro v6.0.0 发布
前端
T畅N1 天前
审批流设计器(前端)
前端·elementui·vue·html·流程图·js
AlunYegeer1 天前
JAVA,以后端的视角理解前端。在全栈的路上迈出第一步。
java·开发语言·前端
IT_陈寒1 天前
Redis这个内存杀手,差点让我们运维半夜追杀我
前端·人工智能·后端