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实例中的变量,方法等,解决方案就在上面的代码中。


#### 结束:记录下,以方便自己和遇到此类问题的朋友(大佬可以略过)
相关推荐
单线程1213839 分钟前
从案例分析 Vue3 Tokenizer 源码
前端·javascript·vue.js
明月_清风42 分钟前
🖥️ Electron 三进程 Host 实战:从架构设计到生产落地的完整指南
前端·electron·客户端
GIS数据转换器1 小时前
智慧林草“一张图“平台
java·大数据·服务器·前端·javascript·数据库·人工智能
2401_885885041 小时前
国际语音php接口代码示例:PHP使用cURL快速调用语音发送API
android·开发语言·前端·人工智能·python·php·语音识别
leoZ2311 小时前
AI+前端提效-08 AI自动化文档:前端组件、接口、项目文档自动生成
前端·人工智能·深度学习·神经网络·目标检测·自然语言处理·自动化
lilian2331 小时前
HarmonyOS 7 新特性(五)|ContainerReader 容器断点与自适应布局
前端·华为·harmonyos
计算机魔术师1 小时前
Google DeepMind 将 AI 科学家 Co-Scientist 扩展为实验室集成研究伙伴
前端
2601_965798471 小时前
BrandBoost WordPress Theme Review: Fast Agency Web Architecture
前端
律宏阔2 小时前
Electron 集成 Drizzle + SQLite 踩坑笔记
前端
律宏阔2 小时前
Electron preload.ts 类型无法自动推导的解决方案
前端