vue router 路由跳转获取不到参数

问题:
路由传参一直不能获取到参数, 未出现报错

原因:
混淆 query 和 params 的使用方法, 在使用 params 传参时错误的使用了 path

代码:
正确写法1:

使用path要对应query

    ...this.$router.push({path: '/Health',query: {title: item['name'],list: item['list']}})

获取方式
    const { title, actionList } = this.$route.query


正确写法2:

使用name要对应params

    ...this.$router.push({name: 'Health',params: {title: item['name'],list: item['list']}})

获取方式
    const { title, list } = this.$route.params


总结:
query 传参是使用 path 来引入,会将传递的参数显示在 url 后,像是带参的 get 请求
params 传参使用 name 引入,会隐藏参数,像是 post
使用 query 页面刷新时不会清空传入的数据, params 则会清空

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

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

相关文章

【多线程案例】单例模式(懒汉模式和饿汉模式)

文章目录 1. 什么是单例模式?2. 立即加载/“饿汉模式”3. 延时加载/“懒汉模式”3.1 第一版3.2 第二版3.3 第三版3.4 第四版 1. 什么是单例模式? 提起单例模式,就必须介绍设计模式,而设计模式就是在软件设计中,针对特殊…

Pycharm中出现ImportError:DLL load failed:找不到指定模块的解决方法

不论搭建什么工程,运行什么文件,只要在Pycharm中出现ImportError: DLL load failed: 找不到指定的模块这样的问题,以下方法都适用!!! 一、问题描述 我在使用pycharm连接webots,用python控制机…

element-ui el-table 树形结构 父子级联动

el-table 表格 为 select 和 select-all 设置回调函数 <el-table :data"tableData" id"yc_load" ref"yc_load" height"500px" border default-expand-allrow-key"showId" :tree-props"{children: children}"se…

OB Cloud助力泡泡玛特打造新一代分布式抽盒机系统

作为中国潮玩行业的领先者&#xff0c;泡泡玛特凭借 MOLLY、DIMOO、SKULLPANDA 等爆款 IP&#xff0c;以及线上线下全渠道营销收获了千万年轻人的喜爱&#xff0c;会员数达到 2600 多万。2022 年&#xff0c;泡泡玛特实现 46.2 亿元营收&#xff0c;其中线上渠道营收占比 41.8%…

Vue中过滤器如何使用?

过滤器是对即将显示的数据做进⼀步的筛选处理&#xff0c;然后进⾏显示&#xff0c;值得注意的是过滤器并没有改变原来 的数据&#xff0c;只是在原数据的基础上产⽣新的数据。过滤器分全局过滤器和本地过滤器&#xff08;局部过滤器&#xff09;。 目录 全局过滤器 本地过滤器…

判断EditText键盘输入的是中文还是英文,如何监听

为了判断EditText键盘输入的是中文还是英文&#xff0c;你可以使用InputMethodManager类来获取当前输入法的信息。在输入法切换时&#xff0c;你可以通过监听EditText的文本改变事件来判断输入法的类型。下面是一个简单的示例代码&#xff1a; // 监听EditText的文本改变事件 …

ROS实现一个节点同时发布订阅多个话题(C++版)

如果想在一个节点同时发布订阅多个话题就要使用到多线程机制&#xff0c;在C中如何使用多线程&#xff0c;在C中开多线程模板已经有了介绍&#xff0c;就是下面这个&#xff1a; #include<thread>void listenThread() {// 线程1内容 }void sendThread() {// 线程2内容 }…

前端面试基础面试题——6

1.CSS 隐藏元素的几种方法&#xff08;至少说出三种&#xff09; 2.页面导入样式时&#xff0c;使用 link 和import 有什么区别&#xff1f; 3.伪元素和伪类的区别&#xff1f; 4.行内元素和块级元素的具体区别是什么&#xff1f;行内元素的 padding 和 margin 可设置吗&…

将虚拟机网络适配器改为仅主机模式,Vmware弹出“仅主机模式适配器驱动程序似乎未运行

这个问题的原因是&#xff0c;主机上缺乏VMware安装后没有VMnet1和VMnet8网卡。 所以

win10下使用composer安装依赖ssl报错处理

报错&#xff1a;you are running Composer with SSL/TLS protection disabled. https://repo.packagist.org could not be fully loaded (curl error 60 while downloading https://repo.packagist.org/packages.json: SSL certificate problem: unable to get local issuer c…

Springboot 实践(13)spring boot 整合RabbitMq

前文讲解了RabbitMQ的下载和安装&#xff0c;此文讲解springboot整合RabbitMq实现消息的发送和消费。 1、创建web project项目&#xff0c;名称为“SpringbootAction-RabbitMQ” 2、修改pom.xml文件&#xff0c;添加amqp使用jar包 <!-- RabbitMQ --> <dependency&g…

EXCEL 中find,if and,if or

接上一篇sql中find函数的作用&#xff0c;由于工作需求是用帆软做报表&#xff0c;他的一些代码不仅有js&#xff0c;sql中的还有一些excel的相关知识&#xff0c;故作整理。 FIND() excel中的find原理和sql中相似&#xff0c;具体可查看 SQL函数 $FIND_Yangshiwei....的博客…

Python,如何安装lap,pip安装lap出现问题

Linux可以&#xff1a; pip install cpython pip install gitgit://github.com/gatagat/lap.gitwindows可以&#xff1a; 下载https://github.com/gatagat/lap 后解压&#xff0c; 安装pip install cpython 安装VS2019企业版&#xff1a; key BF8Y8-GN2QH-T84XB-QVY3B-RC4D…

自动化测试

1. 什么是自动化 1.1 自动化概念 自动化就是解放测试人员双手&#xff0c;测试工作由代码代替人工执行测试工作。 自动化不能完全代替手工测试。 自动化测试指软件测试的自动化&#xff0c;在预设状态下运行应用程序或系统&#xff0c;预设条件包括正常和异常&#xff0c;最…

qt 信号与槽机制,登录界面跳转

登录界面跳转 配置文件 .pro QT core gui texttospeechgreaterThan(QT_MAJOR_VERSION, 4): QT widgetsCONFIG c11# The following define makes your compiler emit warnings if you use # any Qt feature that has been marked deprecated (the exact warnings # d…

CSS3常用的新功能总结

CSS3常用的新功能包括圆角、阴渐变、2D变换、3D旋转、动画、viewpor和媒体查询。 圆角、阴影 border-redius 对一个元素实现圆角效果&#xff0c;是通过border-redius完成的。属性为两种方式&#xff1a; 一个属性值&#xff0c;表示设置所有四个角的半径为相同值&#xff…

免费SSL/TLS域名证书Certbot配置详细过程

文章目录 1. 在服务器上安装 Certbot2. 停止 web 服务器3. 运行 certbot 命令4. 证书生成位置5. 配置 web 服务器6. 重新加载 web 服务器7. 验证8. 配置自动续期发现问题1. Problem binding to port 80: Could not bind to IPv4 or IPv6.2. live directory exists for example.…

Clion 使用ffmpeg 学习1 开发环境配置

Clion 使用ffmpeg 学习1 开发环境配置 一、准备工作1. 准备环境2. 下载FFmpeg 二、操作步骤1. Clion 新建一个C项目2. 修改 CMakeLists.txt3. 修改配置4. 运行测试5. 打印rtsp 流信息的 demo 一、准备工作 在视频处理和多媒体应用程序开发中&#xff0c;FFmpeg 是一个强大的开…

MS1826A HDMI 多功能视频处理器 HDMI4进1出画面分割芯片

基本介绍 MS1826A 是一款多功能视频处理器&#xff0c;包含 4 路独立 HDMI 音视频输入通道、1 路 HDMI 音视 频输出通道以及 1 路独立可配置为输入或者输出的 SPDIF、I2S 音频信号。支持 4 个独立的字库定 制型 OSD&#xff1b;可处理隔行和逐行视频或者图形输入信号&#xff1…

数学建模--逻辑回归算法的Python实现

首先感谢CSDN上发布吴恩达的机器学习逻辑回归算法任务的各位大佬. 通过大佬的讲解和代码才勉强学会. 这篇文章也就是简单记录一下过程和代码. CSDN上写有关这类文章的大佬有很多,大家都可以多看一看学习学习. 机器学习方面主要还是过程和方法. 这篇文章只完成了线性可分方面的任…