当前位置: 首页 > news >正文

合并params和query参数

场景:三级分类只有query参数,搜索框使用params参数。为了解决这个问题,文中在typeNav的index.vue和Head/index.vue分别进行了判断和处理,确保在不同的路径下合并params和query参数能正确合并并传递。

如何当点击联动框时跳转到search路由,同时带着点击组件搜到的query参数,然后在搜索框中搜索词条,词条转为params参数也要带着,即现在$route中既要有query参数又要有params参数。

在Header组件中
源代码:

 this.$router.push({name: 'search',params: { keyword: this.keyword || undefined },})

route中本来就有query属性时保留这个query属性,当route中本来就有params属性保留这个params属性。
修改之后:

  let location = {name: 'search',params: { keyword: this.keyword || undefined },}if (this.$route.query) {location.query = this.$route.query}this.$router.push(location);

在TypeNav中
源代码:

   let location = { name: "search" };let query = { categoryName: categoryname };location.query = query;this.$router.push(location);

修改之后:

	let location = { name: "search" };let query = { categoryName: categoryname };// 判断:如果由跳转的时候如果由params参数,也进行传递if(this.$route.params){location.params = this.$route.params}// 合并路径和参数location.query = query;// 路由跳转this.$router.push(location);

当带着params属性点击联动框可以保留这个params属性,但带着query属性进行搜索时反而收不到的params属性。
应该在router文件中search的位置添加上params传参的占位符。

name: 'search',
path: '/search:keyword',  // 占位符
component: Search,
meta:{isFooterShow:true,
}

相关文章:

合并params和query参数

场景:三级分类只有query参数,搜索框使用params参数。为了解决这个问题,文中在typeNav的index.vue和Head/index.vue分别进行了判断和处理,确保在不同的路径下合并params和query参数能正确合并并传递。 如何当点击联动框时跳转到se…...

[数据集][目标检测]工程机械车辆检测数据集VOC+YOLO格式3189张10类别

数据集格式:Pascal VOC格式YOLO格式(不包含分割路径的txt文件,仅仅包含jpg图片以及对应的VOC格式xml文件和yolo格式txt文件) 图片数量(jpg文件个数):3189 标注数量(xml文件个数):3189 标注数量(txt文件个数):3189 标注…...

构建域名服务器-BIND:Linux端的安装过程及配置文件详解

文章目录 构建域名服务器工具-BINDBIND的安装BIND配置文件详解1. /etc/named.conf:2. /etc/named.rfc1912.zones:3. /var/named/named.localhost:4./etc/logrotate.d/named5./etc/named.iscdlv.key6./etc/named.root.key7./etc/rndc.conf8./e…...

linux查询目录文件基础操作

基础命令 展示所有目录 ls 长格式列出(显示文件权限、所有者、大小和最后修改时间): ls -l 忽略大小写查询 ls | grep -i name 查找特定名称的文件: find /path/to/search -name "filename" 忽略大小写查找文件&#…...

搭建TestBench,收藏这几条基本框架就够了

Verilog功能模块HDL设计完成后,并不代表设计工作的结束,还需要对设计进行进一步的仿真验证。掌握验证的方法,即如何调试自己的程序非常重要。在RTL逻辑设计中,要学会根据硬件逻辑来写测试程序即写Testbench。Verilog测试平台是一个…...

怎么利用住宅代理提高数据抓取效率

在大数据时代,数据抓取已经是从互联网收集数据的关键手段,得到了广泛的应用。不论是网络营销、电商平台、或者是新闻网站,数据抓取都可以帮助企业或者是个人收集到大量的数据。但是随着反爬虫技术的不断发展,传统的爬虫方法已经不…...

c#中的ManuaResetEvent

在C#中,ManualResetEvent 是一个同步事件,用于线程间通信。它允许一个或多个等待的线程等待某个事件的发生。当事件被设置为已发生(或称为“信号”)状态时,所有等待的线程都会被释放,并且可以继续执行。 以…...

EE trade:黄金投资的利弊与要点

黄金投资作为一种相对传统的投资途径,存在着特定的优势与风险。接下来详细剖析一下黄金投资的优缺点。 1、黄金投资的优点 有效对抗通货膨胀 在通货膨胀时期,黄金往往能有出色的表现,其价值通常会上升,如此一来便能够为投资者提…...

数据仓库模型评估的标准

面试中,肯定有数仓同学被问到:数据模型如何去评估、如何优化,那今天就聊一聊这个话题。 基本概念 模型:表达的是某一个主题、某一个业务过程,赋值业务价值,最终落地还是一个建表的过程 数仓模型&#xf…...

121231

实打实大苏打...

【机器学习】逻辑回归原理(极大似然估计,逻辑函数Sigmod函数模型详解!!!)

目录 🍔 逻辑回归应用场景 🍔 极大似然估计 2.1 为什么要有极大似然估计? 2.2 极大似然估计步骤 2.3 极大似然估计的例子 🍔 Sigmod函数模型 3.1 逻辑斯特函数的由来 3.2 Sigmod函数绘图 3.3 进一步探究-加入线性回归 3…...

网络热门编程项目导学:黑马点评

本文作者:程序员鱼皮 免费编程学习 - 编程导航网:https://www.code-nav.cn 大家好,我是鱼皮。 之前已经给大家分享了三个全栈项目,比如瑞吉外卖什么的,这几个项目都是侧重于带大家学习框架的运用、以及一些简单的业务…...

如何在本地和远程删除 Git 分支?

如何在本地和远程删除 Git 分支? 欢迎来到英杰社区https://bbs.csdn.net/topics/617804998 欢迎来到我的主页,我是博主英杰,211科班出身,就职于医疗科技公司,热衷分享知识,武汉城市开发者社区主理人 擅长.n…...

08 STM32 DMA

DMA 协助CPU,完成数据转运工作。 两个程序: DMA数据转运,DMAAD多通道 DMA数据转运,将使用DMA,进行存储器到存储器的数据转运,也就是把一个数组里面的数据,复制到另一个数组里。 定义一个数组D…...

LLM之基于llama-index部署本地embedding与GLM-4模型并初步搭建RAG(其他大模型也可,附上ollma方式运行)

前言 日常没空,留着以后写 llama-index简介 官网:https://docs.llamaindex.ai/en/stable/ 简介也没空,以后再写 注:先说明,随着官方的变动,代码也可能变动,大家运行不起来,可以进…...

Python 异步爬虫:高效数据抓取的现代武器

标题:“Python 异步爬虫:高效数据抓取的现代武器” 在当今信息爆炸的时代,网络爬虫已成为数据采集的重要工具。然而,传统的同步爬虫在处理大规模数据时往往效率低下。本文将深入探讨如何使用 Python 实现异步爬虫,以提…...

【数据结构算法经典题目刨析(c语言)】使用数组实现循环队列(图文详解)

💓 博客主页:C-SDN花园GGbond ⏩ 文章专栏:数据结构经典题目刨析(c语言) 目录 一.题目描述 二.解题思路 1.循环队列的结构定义 2.队列初始化 3.判空 4.判满 5.入队列 6.出队列 7.取队首元素 8.取队尾元素 三.完整代码实…...

PTA L1-005 考试座位号

L1-005 考试座位号(15分) 每个 PAT 考生在参加考试时都会被分配两个座位号,一个是试机座位,一个是考试座位。正常情况下,考生在入场时先得到试机座位号码,入座进入试机状态后,系统会显示该考生…...

软件测试3333

禅道? 学习正则表达式 目标: 能说出软件测试缺陷判定标准 能说出项目中缺陷的管理系统 能使用Excel对于缺陷进行管理 能使用工具管理缺陷 一、用例执行 说明:用例执行不通过,执行结果与用例的期望结果不一致(含义&…...

JJJ:结构体定义中常加的后缀:attribute ((packed))

__attribute__ ((packed)): 的作用就是告诉编译器取消结构体在编译过程中的优化对齐,按照实际占用字节数进行对齐,是GCC特有的语法。这个功能是跟操作系统没关系,跟编译器有关 在GCC下:struct my{ char ch; int a;} sizeof(int)4…...

2026学生免费用AI编程神器全攻略——白嫖不要白不要,大学生快来

好的,上一章刚教你用GitHub武装自己,筑起技术护城河,但光会搬砖(敲命令)还不够,你得学会“开高达”——用AI编程助手把效率拉满。 2026年了,如果还纯靠手打for循环和查API文档,那你…...

万物识别在智能体(Skills Agent)中的集成应用

万物识别在智能体(Skills Agent)中的集成应用 想象一下,你正在开发一个智能客服机器人,用户发来一张照片,里面是自家厨房水槽下漏水的一堆零件。用户问:“这是什么东西坏了?我该买什么配件?” 传统的文本对…...

解锁微信多设备协同新体验:WeChatPad技术全解析

解锁微信多设备协同新体验:WeChatPad技术全解析 【免费下载链接】WeChatPad 强制使用微信平板模式 项目地址: https://gitcode.com/gh_mirrors/we/WeChatPad WeChatPad通过创新的设备伪装技术,突破微信单设备登录限制,实现手机与平板的…...

别再手动调格式了!用C#和FastReport.Net搞定标签批量打印与90度旋转(附完整源码)

C#与FastReport.Net实战:打造高可用的标签批量打印与旋转解决方案 在仓储管理、物流配送和零售价签打印等场景中,开发人员经常需要处理各种规格的标签打印需求。传统的手动调整方式不仅效率低下,而且难以应对频繁变化的业务需求。本文将分享如…...

LumiPixel Canvas Quest人像生成中的数据结构优化实践

LumiPixel Canvas Quest人像生成中的数据结构优化实践 1. 为什么需要优化数据结构 当你用LumiPixel Canvas Quest处理大批量人像时,有没有遇到过程序变慢甚至崩溃的情况?这通常是因为图像数据在内存中的组织方式不够高效。就像整理衣柜一样&#xff0c…...

YOLOv12模型轻量化实战:应对嵌入式设备资源约束

YOLOv12模型轻量化实战:应对嵌入式设备资源约束 最近几年,目标检测模型在精度上突飞猛进,但随之而来的是模型体积和计算量的急剧膨胀。当你兴冲冲地想把最新的YOLOv12模型部署到Jetson Nano或者树莓派上时,往往会发现现实很骨感&…...

使用圣女司幼幽-造相Z-Turbo为MATLAB科学计算可视化生成示意图

使用圣女司幼幽-造相Z-Turbo为MATLAB科学计算可视化生成示意图 如果你用MATLAB做科研或者工程计算,肯定遇到过这样的烦恼:辛辛苦苦算出来的数据,最后要画图放进论文或者报告里时,总觉得那些图表有点“干巴巴”的,不够…...

stm32cubeide+freertos+c/c++混合编程实战避坑指南

1. STM32CubeIDE与FreeRTOS环境搭建避坑指南 第一次用STM32CubeIDE配置FreeRTOS时,我对着时钟源选项纠结了半小时。后来发现这个选择直接影响系统稳定性——选错时钟源会导致任务调度像喝醉了一样飘忽不定。实测推荐用TIM6替代默认的SysTick作为时基,原因…...

别再手动画点阵了!用PCtoLCD2002搞定LCD/OLED汉字显示,附STM32移植代码

嵌入式开发实战:PCtoLCD2002字模生成与STM32显示全链路解析 在嵌入式设备上实现中文显示一直是开发者面临的经典难题。传统的手动绘制点阵方式不仅效率低下,而且难以保证显示效果的一致性。本文将深入探讨如何利用PCtoLCD2002工具链,从字模生…...

如何用OpenRGB终结RGB灯光控制混乱:终极跨平台解决方案

如何用OpenRGB终结RGB灯光控制混乱:终极跨平台解决方案 【免费下载链接】OpenRGB Open source RGB lighting control that doesnt depend on manufacturer software. Supports Windows, Linux, MacOS. Mirror of https://gitlab.com/CalcProgrammer1/OpenRGB. Relea…...