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

Vue3路由传参

vue3路由和vue2差别不是很大,不过在传参形式上略有改变

在Vue3中使用路由必须引入 useRouter 和 useRoute

import { useRoute, useRouter } from 'vue-router'
  const Router = useRouter() //跳转const Route = useRoute() //获取到值

同Vue2一样,query使用path跳转,params用name跳转

  router.push({path: `/streamcompute-home/${item.projectName}/${item.projectId}/definition/list`,query: { processDefinitionName }})
  router.push({ name: tab.props.name,params:projectId })

 在注册路由的时候规定必须要传入的参数

 对于必须要有参数的情况,可以在路由中配置。比如:页面复用,需要通过key来区分,则需要用到这个方法

//实时计算-项目首页-我关注的-详情页
{path: "/streamcompute-home/:projectName/:projectId/definition/list",name: "projects",component: () =>import("@/components/streamcompute/streamcomputeWork/develop/index.vue"),
},

参数的使用

首先,打印一下router,看看里面有什么

 可以看到,在跳转后的页面中使用参数,也跟vue2有一定的区别,不管是query还是params,都装在router.currentRoute.value里面,我们需要去取。

 所以要这么使用:

【router.currentRoute.value.params】

【router.currentRoute.value.query】

projectName = router.currentRoute.value.params.projectName
projectId = router.currentRoute.value.params.projectId

相关文章:

Vue3路由传参

vue3路由和vue2差别不是很大,不过在传参形式上略有改变 在Vue3中使用路由必须引入 useRouter 和 useRoute import { useRoute, useRouter } from vue-routerconst Router useRouter() //跳转const Route useRoute() //获取到值 同Vue2一样,query使用p…...

用户管理——认证功能JWT和Session

目录用户认证功能的技术选型JWT和Session的区别基于JWT和Session的认证流程基于JWT的认证流程基于Session的认证流程基于JWT和Session的认证的优缺点基于JWT和Session的认证的安全性基于JWT和Session的认证的性能分析基于JWT的一次性和无法废弃基于JWT和Session的认证的续签选择…...

hashlib — 加密哈希算法

hashlib — 加密哈希算法 1.概述 加密可以保护消息的安全,以便验证它们的准确性并且使它们受保护不被拦截。 Python 的加密方式支持包括利用像 MD5 和 SHA 这样的标准算法对消息内容产生签名的 hashlib 和验证消息没有在传输过程中被改变的 hmac hashlib 哈希库模…...

四喜临门选股预警源码指标

{四喜临门选股预警} AP1:CROSS(MA(C,5),MA(C,10)); RSV:(CLOSE-LLV(LOW,9))/(HHV(HIGH,9)-LLV(LOW,9))*100; K:SMA(RSV,3,1); D:SMA(K,3,1); AP2:CROSS(K,D); DIFF:EMA(CLOSE,12) - EMA(CLOSE,26); DEA:EMA(DIFF,9); AP3:CROSS(DIFF,DEA); AP4:CROSS(MA(V,5),MA(V,10)); GYTJ1:…...

Kotlin新手教程五(扩展)

一、扩展 在Kotlin中可以给一个类添加一个新的方法而不用继承该类或者使用设计模式,这样的方法称为扩展。 1.扩展函数 声明一个扩展函数,我们需要用一个 接收者类型 也就是被扩展的类型来作为他的前缀。 下面代码为 MutableList 添加一个swap 函数&am…...

QT入门Containers之Widget、Frame

目录 一、QWidget界面相关 1、布局介绍 2、基本界面属性 3、特殊属性 二、QFrame 三、Demo展示 此文为作者原创,创作不易,转载请标明出处! 一、QWidget界面相关 1、布局介绍 为什么将QWidget容器放在第一个,因为目前使用过…...

数据结构与算法基础-学习-12-线性表之顺序队

一、个人理解队列是线性表的衍生之一,具有先进先出的特性,在队尾进行插入操作,在队头进行删除操作。队列的存储结构分为两个大类,一种是顺序队,就是用数组实现。另一种就是链队,使用链表实现。顺序队存在真…...

Python 字典(Dictionary)小窍门

字典是另一种可变容器模型,且可存储任意类型对象。字典的每个键值 key:value 对用冒号 : 分割,每个键值对之间用逗号 , 分割,整个字典包括在花括号 {} 中 ,格式如下所示:d {key1 : value1, key2 : value2 }注意:dict …...

知识图谱构建技术综述

摘要 *知识图谱为实现语义化智能搜索以及知识互联打下了基础,。, *随着知识的发展,传统的基于模板和规则构建的知识图谱已经被深度学习所替代。 知识组织得原则中:知识的充分性、有序性和标准化规则。深度学习的效果在很大程度上…...

环境变量和进程地址空间

目录 环境变量: env:显示所有的环境变量: echo $环境变量名表示查看环境变量的值 理解环境变量: getenv:显示环境变量的值 export set命令:显示所有变量 unset取消变量: pwd:当…...

【数据结构】栈和队列

目录 一、栈 1、栈的定义 2、栈的模拟实现(顺序栈) 1、创建一个顺序结构的栈 2、实现压栈方法(push) 3、模拟实现pop方法(出栈) 4、模拟实现peek(查看) 5、测试上述方法 3、栈的应用场景 1、改变元…...

sql复习(视图、Top-N分析、其他数据库对象)

一、视图view 1.视图定义 视图是一种虚表。 视图建立在已有表的基础上, 视图赖以建立的这些表称为基表。 向视图提供数据内容的语句为 SELECT 语句, 可以将视图理解为存储起来的 SELECT 语句。 视图向用户提供基表数据的另一种表现形式。 2.使用视图的好处 控制数据访问 简…...

2023年私募股权基金研究报告

第一章 概况 PE是私募,也即私募投资基金,是指以非公开发行方式向合格投资者募集的,投资于股票、股权、债券、期货、期权、基金份额及投资合同约定的其他投资标的(如艺术品、红酒等)的投资基金,简称私募基金…...

Redis单点故障+红锁原理

提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档 文章目录 一、Redis单点故障二、红锁原理三、Redission实现了红锁一、Redis单点故障 单台redis容易出单点故障采用集群,获取到锁之后数据持久化到rdb,aof文件中从节点有可能在从主节点拿到数据之前,主节点…...

数据库中的存储过程

1、创建存储过程create procedure sp_name[参数名] [类型],[参数名] [类型]asbegin.........end以上格式还可以简写成:create proc sp_name[参数名] [类型],[参数名] [类型]asbegin.........end/*注:“sp_name”为需要创建的存储过程的名字,该…...

基于 VPX 总线的工件台运动控制系统研究与开发-DSP+FPGA硬件架构(一)

作为光刻机核心单元之一,超精密工件台主要负责实现快速扫描、上下片、精密定位、调平调焦等功能。目前,较为成熟的方案大多采用 VME 并行总线架构来建立超精密工件台控制系统,由于随着系统性能要求的提升,VME 总线以及相应的处理器…...

Android 9.0 根据包名授予app所需的权限

1.概述 在9.0的系统rom产品定制化开发中,在对系统app首次启动默认是会弹出授权的弹窗的,但是对于产品来说会显示的有些麻烦,对产品体验度也不是很好,所以在进行产品开发的时候,默认要求对一些app根据包名授予权限,这样就不会弹出授权的窗口了默认就有权限了,接下来就来实…...

如何将Python包发布到PyPI上,使用pip安装自己的库

如何发布自己的第三方库1. PyPi的用途2.Python包发布步骤2.1 创建目录结构2.2 准备文件1、README.rst2、LICENSE.txt,创建许可证3、setup.py文件4.克隆setup.py仓库(推荐)2.3 编写核心代码2.4 生成分发档案2.5 发布包到PyPi3.验证发布PYPI成功…...

【Git】git常用命令总结

简言 git是一个开源的分布式版本控制系统,可以有效、高速地处理从很小到非常大的项目版本管理。 里面有很多常用的命令语法,在此做一个常用命令总结记录,以备不时之需。 命令总结 由于git是基于linux开发的工具,所以有个特点&a…...

Cortex-M0中断控制和系统控制

目录1.NVIC和系统控制块特性2.中断使能和清除使能3.中断挂起和清除挂起4.中断优先级5.中断控制的通用汇编代码使能和禁止中断设置和清除中断挂起状态设置中断优先级6.异常屏蔽寄存器(PRIMASK)7.中断输入和挂起行为8.中断等待9.系统异常的控制寄存器10.系…...

科技云报道:2023,云计算的风向变了

科技云报道原创。 2022,是云计算的“分水岭”之年。 与前两年的火热相比,2022年云计算行业实属不太好过:阿里云一季度营收增速创出历史新低,腾讯云的市场份额也被后来者华为云反超,沦为第三。 在此情形下&#xff0c…...

工程管理系统源码-专注项目数字化管理-工程管理

工程项目各模块及其功能点清单 一、系统管理 1、数据字典:实现对数据字典标签的增删改查操作 2、编码管理:实现对系统编码的增删改查操作 3、用户管理:管理和查看用户角色 4、菜单管理:实现对系统菜单的增删改查操…...

Nacos详细使用操作文档(图文详细)

文章目录Nacos详细使用操作文档(图文详细)1、安装2、Nacos作为注册中心2.1、Nacos服务注册【ICRMS】2.2、Nacos 服务调用2.2.1、Feign 远程调用【Personnel】2.2.2)、RestTemplateRibbon 远程调用【Personnel】3、Nacos作为配置中心4、Nacos 命令空间5、Nacos配置文件参数详解N…...

如何评价2023年美赛ABC题目

A题 遭受干旱侵袭的植物群落 背景 不同种类的植物对压力的反应方式不同。例如,草原对干旱非常敏感。干旱发生的频率和严重 程度各不相同。大量的观察表明,不同物种的数量在植物群落如何适应连续几代的干旱周期中 起着重要作用。在一些只有一种植物的…...

Win10显示dds及tga缩略图

整理之前做游戏MOD时收集的模型资源,3D游戏模型的贴图文件格式基本都是dds或tga的,毕竟无损压缩、支持嵌入MipMap、带透明通道、可以被GPU硬解balabala...道理我都懂但这俩玩意系统根本直接查看不了,就算装上专门的看图软件或插件,文件夹视图下也没有缩略图预览,只能一个个点开…...

Lesson5.1---Python 之 NumPy 简介和创建数组

一、NumPy 简介 NumPy(Numerical Python)是 Python 的一种开源的数值计算扩展。这种工具可用来存储和处理大型矩阵,比 Python 自身的嵌套列表(nested list structure)结构要高效的多(该结构也可以用来表示…...

Exchange 2013升级以及域名绑定等若干问题

环境简介Exchange 2013服务器位于ad域中,系统为Windows server 2012 R2,其内部域名为:mail.ad.com一. Exchange客户端无法在浏览器中正常运行在域中部署Exchange服务器后,除了可以通过outlook、foxmail等邮件客户端来使用邮箱功能…...

linux安装jenkins

1. 官网寻找安装方式 进入到jenkins官网,找到对应的下载页面:https://www.jenkins.io/download/ 根据自己系统还有想要使用的版本,进行选择即可。这里我们使用CentOS作为示例,版本选择长期支持版(LTS) 2.…...

【MySQL】MySQL表的增删改查(CRUD)

✨个人主页:bit me👇 ✨当前专栏:MySQL数据库👇 ✨算法专栏:算法基础👇 ✨每日一语:生命久如暗室,不碍朝歌暮诗 目 录🔓一. CRUD🔒二. 新增(Creat…...

GCC for openEuler 数据库性能优化实践

GCC for openEuler是基于开源GCC开发的编译器工具链(包含编译器,汇编器,链接器),在openEuler社区开源发布,并通过鲲鹏社区免费提供二进制包,支持aarch64处理器架构。 关键特性 支持鲲鹏微架构芯…...

专门做产品推广ppt的网站/鹤壁seo

2014年初,4G联网首次进入汽车前装市场,同一年,通讯及手机芯片厂商高通公司首次推出骁龙602A处理器,开启汽车联网信息娱乐服务新纪元。 两年后,高通发布了全新的信息娱乐系统处理器骁龙820A,和骁龙602A相比…...

wordpress 会员支付宝/天津百度推广

稳压二极管的工作原理:稳压二极管也叫稳压管,它在电路中一般起到稳定电压的作用,也可以为电路提供基准电压值。稳压二极管使用特殊工艺制造,这种工艺使它在反向击穿时仍然可以长时间稳定工作,不损坏,而工作…...

html5网站案例/岳阳网站界面设计

矩形以列表 [x1, y1, x2, y2] 的形式表示,其中 (x1, y1) 为左下角的坐标,(x2, y2) 是右上角的坐标。矩形的上下边平行于 x 轴,左右边平行于 y 轴。 如果相交的面积为 正 ,则称两矩形重叠。需要明确的是,只在角或边接触…...

网站源码下载插件/杭州10大软件开发公司

昨晚安全新闻爆出一个“PHP任意文件上传漏洞”,CVE编号为:CVE-2015-2348。当时楼主正准备收拾东西回家,看到这个新闻心里一惊:失传江湖多年的0字符截断上传漏洞又重现了?而且还影响这么多版本!如果漏洞属实…...

王野电动车/关键词整站排名优化

...

txt做网站如何加图片/网站制作免费

矩阵图即用一张图绘制多个变量之间的关系,数据挖掘中常用于初期数据探索;本文介绍python中seaborn.pairplot(傻瓜版)和seaborn.PairGrid(更个性化版)绘制矩阵图本文内容速览 欢迎随缘关注@pythonic生物人...