vue3 路由带传参跳转;刷新后消失。一次性参数使用。

news2024/11/26 12:32:58

解决vue3 怎么做到路由跳转传参刷新后消失
解决路由跳转传参去除问题

想要跳转后根据参数显示对应的tab,但url传参刷新会持续保留无法重置。
router.replace替换又会导致显示内容为router.replace后的,传参目的丢失。

业务逻辑: 完成对应操作后(点击按钮)返回指定页面(recruit/enterprise/position页面)

// 页面A
const handleCancel = (hire) => { //  hire:是否是众聘岗位
  router.push({ path: '/recruit/enterprise/position', query: { hire: hire ? 1 : 0 } })
}

在这里插入图片描述

在这里插入图片描述

// 页面B
const showHire = (route.query?.hire - 0) || 0
const tab = ref(showHire ? 4: 1)
if (showHire) history.replaceState({ ...route.query, hire: 0 }, '', route.path)
// 更新浏览器历史记录,不触发页面重新加载 ( 目的:去除目标参数 )
// 参数完全不保留使用history.replaceState({}, '', newUrl),传入{}空对象
// 不使用vue的话可以window.location.href.replace(/\?.*$/, "")或者window.location.hash.replace(/\?.*$/, "")获取路由

参考于https://zhuanlan.zhihu.com/p/691957141奇迹天蝎 的文章

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/2035491.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

基于LPF改进的反电势观测器+锁相环PLL的永磁无感控制

导读:上期文章介绍的基于EMF+PLL的中高速永磁无感控制,其中决定转速和位置的估算精度的是反电势的获取精度。直接计算法很难保证反电势的估算精度,所以本期文章介绍一种基于LPF的改进型EMF观测器。 一、基于LPF改进的EMF观测器 传统的EMF观测器的表达式为: 注:这里重点强…

怎么用dos编译python

无论windos还是Linux只要安装了python,配置好了环境变量,则在命令行输入python这个命令的时候就会进入交互模式。在这个模式下可以进行一些简单的python代码编写。退出可以使用exit()方法。 Python程序是可以执行的,例如下面代码&#xff0c…

【LeetCode Cookbook(C++ 描述)】一刷二叉树之层序遍历(BFS)

目录 LeetCode #102:Binary Tree Lever Order Traversal 二叉树的层序遍历递归解法迭代解法 LeetCode #107:Binary Tree Level Order Traversal II - 二叉树的层序遍历 II递归解法迭代解法 LeetCode #429:N-ary Tree Level Order Traversal -…

8月13日

思维导图 作业 TCP机械臂测试 通过w(红色臂角度增大)s(红色臂角度减小)d(蓝色臂角度增大)a(蓝色臂角度减小)按键控制机械臂 代码 #include<myhead.h>#define SER_PORT 8888 #define SER_IP "192.168.0.108" #define CLI_PORT 6666 #define CLI_IP "192.…

Unity数据持久化 之 LitJson序列化与反序列化

语法规则可以看这篇文章&#xff1a;Unity数据持久化 之 Json 语法速通-CSDN博客 1.LitJson是什么 LitJSON - Home&#xff0c;Release LitJSON 0.19.0 LitJSON/litjson GitHub LitJSON是一个net库&#xff0c;用于处理与JSON (JavaScript Object Notation)字符串之间的转换…

【RTOS面试题】临时屏蔽/禁用中断的方法有什么用?什么时候用?做这种方法时应该注意什么?

目录 一、临时屏蔽中断的用途二、使用场景三 、 注意事项四、 示例代码五、结论 临时屏蔽/禁用中断的方法在嵌入式系统开发中非常重要&#xff0c;尤其在处理中断密集型的任务时。下面将详细介绍这种方法的用途、应用场景以及注意事项。 一、临时屏蔽中断的用途 保护关键代码段…

GStreamer 简明教程(二):基本概念介绍,Element 和 Pipeline

系列文章目录 GStreamer 简明教程&#xff08;一&#xff09;&#xff1a;环境搭建&#xff0c;运行 Basic Tutorial 1 Hello world! 文章目录 系列文章目录前言一、查看插件信息1.1 gst-inspect 介绍1.2 源码中运行 gst-inspect1.3 理解插件的基本信息1.4 插件与元素1.5 总结…

Stable Diffusion XL【模型推荐】沙雕手绘Lora,贼开心!不要问我这个有什么用,因为只有真正懂沙雕的才知道

前言 hello&#xff0c;大家好** 看惯了满屏的精致画面&#xff0c;咱们也来改改画风。今天老徐给大家带来了一款别有风趣的Lora模型——YFilter_ShaDiaoShouHui沙雕手绘模型。看腻了精致严谨的作品&#xff0c;这块模型肯定让你觉得太惊艳了。用作者的话说——不要问我这个Lo…

二叉树------最小堆,最大堆。

什么是最小堆&#xff1a; 堆是一种二叉树&#xff0c;最小堆中所有父亲节点的值都要比自己的子节点的值要小。而根节点称为堆顶。根据定义我们可以得到堆中最小元素就在堆顶。&#xff08;节点左上角是编号&#xff0c;内部是元素值&#xff09; 假设该图中的堆顶元素是24呢&a…

【Python】Python单元测试

文章目录 01-单元测试基础什么是单元测试常用的文件结构运行单元测试 02. 断言函数03. Test Fixtures什么是Test Fixtures模块级别的Fixtures类级别的Fixtures方法级别的Fixtures 04.Mock 01-单元测试基础 什么是单元测试常用的文件结构编写第一个单元测试运行单元测试 什么是单…

在CentOS 7 上安装和配置 uwsgi 详细教程

本章教程,主要记录在CentOS7中成功安装uwsgi的详细步骤。 1. 更新系统包 首先,更新系统的包管理器以确保你有最新的软件包信息: sudo yum update -y2. 安装Python和pip CentOS 7 默认提供 Python 2.7,但你可能需要安装 Python 3 及其对应的 pip。以下是安装 Python 3 和…

OpenCV—二值化Threshold()、adaptiveThreshold()

cv2.threshold() c&#xff1a;double cv::threshold ( InputArray src, OutputArray dst, double thresh, double maxval, int type ) (注&#xff1a;源图片, 目标图, 阈值, 填充色, 阈值类型) python:cv.threshold(src,thresh, maxval, type[, dst]) src&#xff1a;源图片…

顶顶通呼叫中心中间件-通话之前录音配置方法(mod_cti基于FreeSWITCH)

顶顶通呼叫中心中间件-通话之前录音配置方法(mod_cti基于FreeSWITCH) 1、修改配置文件 点击配置文件 -> 点击vars -> 根据图中配置 -> 点击提交XML ->重新启动freeswitch 修改成true就是电话接通开始录音&#xff0c;修改成false就是通话之前开始录音。 <!--应…

ES环境搭建、ES安装

文章目录 简介与环境搭建全文检索倒排索引ElasticSearchWindows安装ES下载配置JDK环境启动ES服务 centos7安装ES下载ElasticSearch创建es用户配置JDK环境配置ElasticSearch配置JVM参数启动ElasticSearch服务常见启动报错 客户端Kibana安装下载修改Kibana.yml运行Kibana访问 ES安…

IntelliJ IDEA全新版的0个新特性【送源码】

jetBrains刚刚发布了最新IntelliJ IDEA 2024.2版本&#xff0c;做了不少优化性能方面的优化&#xff0c;同时新的ui也默认为启动ui。感兴趣的小伙伴可以下载体验&#xff0c;以下为官方本次介绍&#xff1a; 借助 IntelliJ IDEA 2024.2 Ultimate&#xff0c;您可以直接在 IDE …

宝塔面板实现定时任务删除 logs文件 加条件删除 只删除一个月前的日志

我们在开发中难免用到了日志功能&#xff0c;随着日志越来越多导致占用我们的内存 下面是一个简单的 使用宝塔面板里面的定时任务来实现删除日志案例 第一步 首先我的日志文件目录 都在log文件夹里面&#xff0c; 每个月生成一个日志文件夹 文件夹命名是年月来命名的 第二…

JVM(一) 类加载器、类加载过程、JVM参数设置

JVM Java编译器 Java源文件在通过编译器之后被编译成相应的.Class文件&#xff08;字节码文件&#xff09; JVM解释器 .Class文件又被JVM中的解释器编译成机器码在不同的操作 系统&#xff08;Windows、Linux、Mac&#xff09;上运行。每种操作系统的解释器都是不同的&#xf…

SpringBoot起步依赖和配置

目录 起步依赖 目的 1 继承父工程&#xff0c;确定版本信息 2 添加 starter-web 坐标信息 配置 配置文件的分类 ​编辑实操 1 后缀名是.properties文件修改端口号&#xff0c;把原本的默认端口号8080改为8082 2 创建后缀名是.yaml文件&#xff0c;尝试修改端口号&…

ARM——体系结构

计算机体系结构&#xff1a;冯诺伊曼 哈佛 冯诺依曼结构 冯诺依曼结构&#xff0c;也称冯诺依曼模型或普林斯顿结构&#xff0c;是根据冯诺依曼提出的存储程序概念设计的计算机体系结构。其主要特点包括&#xff1a; 存储程序&#xff1a;指令与数据都…

【Qt】信号与槽(下)

目录 自定义信号 带参数的信号和槽 信号和槽存在的意义 信号与槽的连接方式 一对一 一对多 多对一 意义 信号和槽的其他说明 信号和槽的断开 使用Lambda表达式定义槽函数 信号与槽的优缺点 优点: 松散耦合 缺点: 效率较低 自定义信号 自定义槽函数是非常关键的&a…