Vue 解决浏览器刷新路由参数丢失问题 全局统一配置无需修改组件

embedded/2025/1/6 8:19:44/

在路由跳转的时候,我们经常会传一些参数过去,然后通过传过来的参数调用接口获取相关数据,但是刷新浏览器的时候路由参数会丢失。此时页面报错误了,如何通过全局配置的方式,不需要修改任何组件 实现刷新浏览器保存参数?

实现方式如下:

 首先在router/index.js里添加参数管理器

// 添加参数管理器
const ParamsManager = {KEY: 'ROUTE_PARAMS_STORAGE',// 保存参数save(path, query) {try {const storage = {path,query,timestamp: new Date().getTime()}sessionStorage.setItem(this.KEY, JSON.stringify(storage))} catch (error) {console.error('保存路由参数失败:', error)}},// 获取参数get(path) {

http://www.ppmy.cn/embedded/150574.html

相关文章

Java中如何实现线程安全的单例模式?

目录 1、懒汉式(线程安全) 2、饿汉式(线程安全) 3、双重校验锁(线程安全) 4、静态内部类(推荐) 5、枚举(最佳方法) 6、总结 在Java中,实现线…

.net core 的函数实现

Python基础 Python是一种广泛使用的高级编程语言,以其简洁易读的语法和强大的功能而闻名。它被广泛应用于数据分析、人工智能、网站开发、自动化脚本及其他众多领域。本文将详细介绍Python的基础知识,包括其安装及环境配置、基本语法、数据类型、控制结…

【机器学习】穷理至极,观微知著:微积分的哲思之旅与算法之道

文章目录 微积分基础:理解变化与累积的数学前言一、多重积分的高级应用1.1 高维概率分布的期望值计算1.1.1 多维期望值的定义1.1.2 Python代码实现1.1.3 运行结果1.1.4 结果解读 1.2 特征空间的体积计算1.2.1 单位球体的体积计算1.2.2 Python代码实现1.2.3 运行结果…

高频生活场景带动低频金融服务,美团企业版点燃场景金融建设引擎

撰稿 | 多客 来源 | 贝多财经 近年来,金融与生活、生产场景深度融合衍生出的“场景金融”逐渐进入大众视野。其中,对公业务场景金融以其在服务实体经济、维护金融稳定等层面的前瞻性,成为银行完善场景体系、传递金融温度的“压舱石”。 上海…

uniapp 微信小程序开发使用高德地图、腾讯地图

一、高德地图 1.注册高德地图开放平台账号 (1)创建应用 这个key 第3步骤,配置到项目中locationGps.js 2.下载高德地图微信小程序插件 (1)下载地址 高德地图API | 微信小程序插件 (2)引入项目…

练习题:29

目录 Python题目 题目 题目分析 1. 知识点覆盖分析 2. 连接库选择与导入分析 3. 连接步骤与参数分析 4. 数据库操作与连接关闭分析 代码实现 代码解释 1. 导入必要的库 2. 配置数据库连接参数 3. 建立数据库连接 4. 创建游标对象 5. 编写并执行 SQL 查询语句 6.…

SpringCloudAlibaba 技术栈—Sentinel

1、什么是sentinel? Sentinel是一个用于微服务架构的流量管理和控制系统,它通过限制和控制进入系统的流量,来保护系统免受过载和故障的影响,确保服务的稳定性。简而言之,它就是一个帮助微服务在高负载情况下也能稳定运行的工具。…

在pytest钩子函数中判断Android和iOS设备(方法一)

在一个UI自动化工程里可以执行iOS UI 自动化和Android UI 自动化,那么在有些公共方法里就需要区分是Android手机还是iOS手机,例如,pytest的钩子函数。 在 pytest_runtest_makereport 这个钩子函数中我添加了,截图和重启app的指令…