vue-router在vue2/3区别

news/2024/11/17 2:28:48/

构建选项区别

vue2-router

 const router-new VueRouter({mode:history,base:_name,})

vue-next-router

import { createRouter,createWebHistory} from vue-next-router
const router=createRouter({history:createHistory(/)
})

在上述代码中我们发现,vue2中的构建选项mode和base,分别为mode和base,而在vue-next-router中变成了,history和history中的第一个参数/.

捕获路由加正则表达式/:catchAll(.*)

vue2-router

 const router=new VueRouter({mode:history,routes:[{path:/user/:a*}]
})

vue-next-router

const router=createRouter({history:createWebHistrory(),routes:[{path:/user/:a:catchAll(.*).component:component}]
})

当路由为 /user/a/b 时,捕获到的 params 为 {“a”: “a”, “catchAll”: “/b”}。

match改变(vue2/3)

match详解点击这里
router.match和router.resolve在vue3中已经被合并,只是签名略有不同。

删除router.getMatchedComponents,可以从router.currentRoute.value.matched 中获取。

router.getMatchedComponents 返回目标位置或是当前路由匹配的组件数组 (是数组的定义/构造类,不是实例)。通常在服务端渲染的数据预加载时使用。

push 或者 resolve 一个不存在的命名路由时,将会引发错误,而不是导航到根路由 “/” 并且不显示任何内容。

在vue2中会自动跳转到跟路由/中,而vue3会报错。


http://www.ppmy.cn/news/1050029.html

相关文章

代码随想录day11

20. 有效的括号 ● 力扣题目链接 ● 给定一个只包括 ‘(’,‘)’,‘{’,‘}’,‘[’,‘]’ 的字符串,判断字符串是否有效。 ● 有效字符串需满足: ● 左括号必须用相同类型的右括号闭合。 ● 左…

数学建模-规划工具箱yalmip

官网下载 实例 %% yalmip 求解 yalmip clc;clear;close all; %% %sdpvar实型变量 intvar 整形变量 binvar 0-1型变量 psdpvar(3,1); %定义变量 %目标函数 要把求最大值转化为最小值 Objective-p(1)^2p(2)^2-p(2)*p(3);%约束条件 Constraints[0<p<1,(p(1)^2p…

功能性需求与非功能性需求的区别

如果你曾经负责过软件项目开展的全过程&#xff0c;就会知道需求定义在项目后期的重要性。清晰、明确的需求定义不仅有助于有效地管理客户期望&#xff0c;也有助于指导项目的顺利开展。 在项目前期阶段&#xff0c;如果需求定义不清晰&#xff0c;就会导致项目范围和成果定义…

clickhouse的ttl

TTL 只能在MergeTree系列表中使用&#xff0c;和分区一样&#xff0c;也只能在mergetree系列表中用 列: 当列的时间超过设置的值 -整列数据被删除 表: 当表中的某个写行的时间超过设置的值 -整行会被删除 定义值的存储时间。只能为MergeTree系列表指定。确定值的生存期。 当…

【python办公自动化】PysimpleGUI中的popup弹窗中的按钮设置居中

PysimpleGUI中的popup弹窗中的按钮设置居中 背景问题解决背景 默认的popup弹窗中的OK按钮是在最下面偏左侧一些,有时需要将按钮放置居中 问题解决 首先找到pysimplegui源代码文件中popup的部分 然后定位到19388行,源文件内容如下 关于popup弹窗OK按钮的设置,将pad属性…

vim编辑器用法详解

文章目录 Linux平台安装VimVim配置文件Vim四种模式基本操作多对象操作常用操作流程多窗口操作多标签页操作 Vim(Vi IMproved)是一个功能强大的文本编辑器&#xff0c;是Vi(Visual Editor)的一个增强版本。它以其高度可定制性、强大的编辑功能和广泛的插件支持而闻名。这里介绍一…

这所“984.5”保护一志愿!集成学硕爆冷,300分以上全要!考数二英一!

一、学校及专业介绍 南京航空航天大学&#xff08;Nanjing University of Aeronautics and Astronautics&#xff09;&#xff0c;简称南航&#xff08;NUAA&#xff09;。位于江苏省南京市&#xff0c;是一所具有航空航天民航特色、以理工类为主的综合性全国重点大学。国家“…

使用ApplicationRunner简化Spring Boot应用程序的初始化和启动

ApplicationRunner这个接口&#xff0c;我们一起来了解这个组件&#xff0c;并简单使用它吧。&#x1f92d; 引言 在开发Spring Boot应用程序时&#xff0c;应用程序的初始化和启动是一个重要的环节。ApplicationRunner是Spring Boot提供的一个有用的接口&#xff0c;可以帮助…