Vue3学习——路由prop配置、replace

写法一

在路由中可直接写prop: true,即可在页面中defineProps使用

  • 相当于(<Detail id=“1” name==“2” />),但只能是params
{path: '/service',name: '服务',component: () => import('../views/Service/index'),props: true},
写法二(query写法)
{path: '/service',name: '服务',component: () => import('../views/Service/index'),props(route) {return route.query}},

页面

defineProps(['id', 'name']) // 即可使用
写法三(只能固定写死)
{path: '/service',name: '服务',component: () => import('../views/Service/index')props() {return {x: 1,y: 2,z: 3}}},

replace

<RouterLink replace to="/home" active-class='active'>首页</RouterLink>

编程式路由导航

在vue2中重复跳转会报错,但vue3不会报错

import {useRouter} from 'vue-router'
const router = useRouter()
router.push('/')
router.replace('/')

params不能与path搭配使用
在这里插入图片描述

重定向 redirect

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

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

相关文章

Javaweb之SpringBootWeb案例之 Bean管理的获取Bean详细的解析

2. Bean管理 在前面的课程当中&#xff0c;我们已经讲过了我们可以通过Spring当中提供的注解Component以及它的三个衍生注解&#xff08;Controller、Service、Repository&#xff09;来声明IOC容器中的bean对象&#xff0c;同时我们也学习了如何为应用程序注入运行时所需要依…

【QT+QGIS跨平台编译】之五十三:【QGIS_CORE跨平台编译】—【qgssqlstatementparser.cpp生成】

文章目录 一、Bison二、生成来源三、构建过程一、Bison GNU Bison 是一个通用的解析器生成器,它可以将注释的无上下文语法转换为使用 LALR (1) 解析表的确定性 LR 或广义 LR (GLR) 解析器。Bison 还可以生成 IELR (1) 或规范 LR (1) 解析表。一旦您熟练使用 Bison,您可以使用…

将法律条文很美观的复制到word上

前言 目前很多法律条款都没有现成的PDF或者word格式的供大家下载&#xff0c;这个时候呢&#xff0c;领导又要求你帮他搞定&#xff0c;这就很。。。。 步骤 复制全部条款到word中使用wps的排版功能&#xff0c;将空格和空段落全部移除 3. 设置好你需要的格式 标题&#xff…

黑马程序员——接口测试——day03——Postman断言、关联、参数化

目录&#xff1a; Potman断言 Postman断言简介Postman常用断言 断言响应状态码断言包含某字符串断言JSON数据Postman断言工作原理Postman关联 简介实现步骤核心代码创建环境案例1案例2Postman参数化 简介数据文件简介编写数据文件 CSV文件JSON文件导入数据文件到postman读取数…

opencv图像腐蚀

腐蚀&#xff08;Erosion&#xff09;是一种形态学图像处理操作&#xff0c;用于移除图像中的小白点、细小物体或者边缘。它通过将结构元素应用于图像上的像素来实现。 以下是opencv实现图像腐蚀的代码 #include <opencv2/highgui/highgui.hpp> #include <opencv2/im…

江科大stm32 定时器 TIM输出比较--学习笔记

这几天遇到输出比较相关的问题&#xff0c;于是来学习下TIM输出比较部分知识点&#xff01; 输出比较简介 CNT是计数器的值&#xff0c;CCR寄存器是捕获/ 比较寄存器 简单的讲&#xff0c;输出比较就是用来输出PWM波形。 PWM简介 占空比&#xff1a;高电平占一个周期的比例。…

袁庭新ES系列12节 | Elasticsearch高级查询操作

前言 上篇文章讲了关于Elasticsearch的基本查询操作。接下来袁老师为大家带来Elasticsearch高级查询部分相关的内容。Elasticsearch是基于JSON提供完整的查询DSL&#xff08;Domain Specific Language&#xff1a;领域特定语言&#xff09;来定义查询。因此&#xff0c;我们有…

vscode不能远程连接ubuntu18.04.6

目录 问题解决Portable Mode 安装vscode 补充说明学习资料 问题 vscode远程ssh连接ubuntu18.04.6时&#xff0c;出现如下提示框&#xff0c;单击Learn More后&#xff0c;定位到问题。Can I run VS Code Server on older Linux distributions? 原始是&#xff1a;需要glibc …

Vue项目构建优化

本文作者为 360 奇舞团前端开发工程师 宁航 在开发大型前端项目时&#xff0c;往往是一个需求对应一个分支&#xff0c;当完成需求后&#xff0c;就需要将代码打包、部署。代码通常需要部署到多个环境中&#xff0c;这些环境包括&#xff1a;日常环境、测试环境、回归环境和生产…

【操作技巧】如何给Jetson Orin Nano的ubuntu port换镜像源

学习《OpenCV应用开发&#xff1a;入门、进阶与工程化实践》一书 做真正的OpenCV开发者&#xff0c;从入门到入职&#xff0c;一步到位&#xff01; 换镜像源 因为工作需要&#xff0c;我想把之前Jetson Orin Nano上OpenCV4.5.4 升级到OpenCV4.8。先到这里下载脚本 wget htt…

搜维尔科技:OptiTrack 提供了性能最佳的动作捕捉平台

OptiTrack 动画 我们的 Prime 系列相机和 Motive 软件相结合&#xff0c;产生了世界上最大的捕获量、最精确的 3D 数据和有史以来最高的相机数量。OptiTrack 提供了性能最佳的动作捕捉平台&#xff0c;具有易于使用的制作工作流程以及运行世界上最大舞台所需的深度。 无与伦比…

【mysql 数据库事务】开启事务操作数据库,写入失败后,不回滚,会有问题么? 这里隐藏着大坑,复试,面试时可以镇住面试老师!!!!

建表字段: CREATE TABLE user (id INT(11) NOT NULL AUTO_INCREMENT,nickname VARCHAR(32) NOT NULL COLLATE utf8mb4_general_ci,email VARCHAR(32) NOT NULL COLLATE utf8mb4_general_ci,status SMALLINT(6) UNSIGNED NULL DEFAULT NULL,password VARCHAR(256) NULL DEFAULT…