当前位置: 首页 > 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…...

【HTML】DOCTYPE作用

<!DOCTYPE html> DOCTYPE是document type&#xff08;文档类型&#xff09;的缩写。是HTML5中一种标准通用标记语言的文档类型声明&#xff0c;告诉浏览器文档的类型&#xff0c;便于解析文档。不同渲染模式会影响浏览器对CSS代码甚至JS脚本的解析。它必须声明在第一行。…...

STM32学习记录-04-EXTI外部中断

1 中断系统 &#xff08;1&#xff09;中断&#xff1a;在主程序运行过程中&#xff0c;出现了特定的中断触发条件&#xff08;中断源&#xff09;&#xff0c;使得CPU暂停当前正在运行的程序&#xff0c;转而去处理中断程序&#xff0c;处理完成后又返回原来被暂停的位置继续…...

Android Studio 动态表格显示效果

最终效果 一、先定义明细的样式 table_row.xml <?xml version"1.0" encoding"utf-8"?> <RelativeLayout xmlns:android"http://schemas.android.com/apk/res/android"android:layout_width"match_parent"android:layout_h…...

Python 全栈系列264 使用kafka进行并发处理

说明 暂时考虑的场景是单条数据处理特别复杂和耗时的场景。 场景如下&#xff1a; 要对一篇文档进行实体处理&#xff0c;然后再对实体进行匹配。在这个过程当中&#xff0c;涉及到了好几部分服务&#xff1a; 1 实体识别服务2 数据库查询服务3 es查询服务 整个处理包成了服…...

【安全靶场】-DC-7

❤️博客主页&#xff1a; iknow181 &#x1f525;系列专栏&#xff1a; 网络安全、 Python、JavaSE、JavaWeb、CCNP &#x1f389;欢迎大家点赞&#x1f44d;收藏⭐评论✍ 一、收集信息 1.查看主机是否存活 nmap -T4 -sP 192.168.216.149 2.主动扫描 看开放了哪些端口和功能 n…...

0065__windows开发要看的经典书籍

windows开发要看的经典书籍_window编程书籍推荐-CSDN博客...

第133天:内网安全-横向移动域控提权NetLogonADCSPACKDC永恒之蓝

案例一&#xff1a;横向移动-系统漏洞-CVE-2017-0146 这个漏洞就是大家熟悉的ms17-010&#xff0c;这里主要学习cs发送到msf&#xff0c;并且msf正向连接后续 原因是cs只能支持漏洞检测&#xff0c;而msf上有很多exp可以利用 注意msf不能使用4.5版本的有bug 这里还是反弹权…...

【IoTDB 线上小课 06】列式写入=时序数据写入性能“利器”?

【IoTDB 视频小课】更新来啦&#xff01;今天已经是第六期了~ 关于 IoTDB&#xff0c;关于物联网&#xff0c;关于时序数据库&#xff0c;关于开源... 一个问题重点&#xff0c;3-5 分钟&#xff0c;我们讲给你听&#xff1a; 列式写入到底是&#xff1f; 上一期我们详细了解了…...

【机器学习】小样本学习的实战技巧:如何在数据稀缺中取得突破

我的主页&#xff1a;2的n次方_ 在机器学习领域&#xff0c;充足的标注数据通常是构建高性能模型的基础。然而&#xff0c;在许多实际应用中&#xff0c;数据稀缺的问题普遍存在&#xff0c;如医疗影像分析、药物研发、少见语言处理等领域。小样本学习&#xff08;Few-Shot Le…...

2024.08.14 校招 实习 内推 面经

地/球&#x1f30d; &#xff1a; neituijunsir 交* 流*裙 &#xff0c;内推/实习/校招汇总表格 1、校招 | 理想汽车2025“理想”技术沙龙开启报名 校招 | 理想汽车2025“理想”技术沙龙开启报名 2、校招 | 紫光国芯2025校园招聘正式启动 校招 | 紫光国芯2025校园招聘正式…...

校园微网站建设方案ppt模板/百度品牌推广

Myeclipse中其实不止tomcat支持的jre和项目工程编译环境jre版本不一致这一种原因会导致异常&#xff1a;Bad version in .class file&#xff1b;数据库链接也会报这种异常&#xff0c;很奇怪&#xff0c;不知道的话就被引入歧途了。转载于:https://blog.51cto.com/3596022/122…...

管理公司网站的职位/怎样进入12345的公众号

cordova应用程序Now we will learn about the various tools which we will require for App development. We have to download 5 different tools: 现在&#xff0c;我们将了解开发App所需的各种工具。 我们必须下载5种不同的工具&#xff1a; NodeJS 节点JS Cordova CLI 科…...

网站建设公司哪家好 地址磐石网络/上海好的seo公司

Yield Guild Games (YGG) 通过与 Solana 上的 free-to-play & move-to-earn 游戏 Walken 合作&#xff0c;扩展到 X-to-earn 类型的游戏。Walken 将步行和跑步等简单的日常活动游戏化&#xff0c;提倡健康的生活方式&#xff0c;奖励玩家体能活动&#xff0c;同时允许他们在…...

重庆智能网站建设推荐/关键词优化策略

自己老师布置的一个题目&#xff1a;在100W个100维的向量中&#xff0c;取出与给定的100维的向量&#xff0c;欧几里得距离最小的前K个向量。我把这个问题分为了2部分&#xff0c;一个是计算部分&#xff0c;一个是统计部分。统计部分用到了索引堆&#xff0c;很好用&#xff0…...

茶山东莞网站建设/网站推广的10种方法

咸鱼Maya笔记—创建NURBS基本体NURBS概述创建NURBS基本体参数说明NURBS建模技术是一种非常优秀的建模方式。Maya作为一款高级三维软件&#xff0c;支持用户采用NURBS建模方式进行模型的创建。与传统的多边形网格建模方式相比&#xff0c;NURBS建模方式可以更好地控制模型表面的…...

网页设计就业/企业关键词优化公司

2019独角兽企业重金招聘Python工程师标准>>> 基本思路&#xff1a;通过一个队列保存最近10次的登录记录&#xff0c;下一次登录请求来时&#xff0c;通过与队列中的第一条进行比较&#xff0c;如果在1分钟之内则拒绝请求&#xff0c;否则移除队首元素&#xff0c;将…...