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

Vue3-VueRouter4路由语法解析

1.创建路由实例由createRouter实现

2.路由模式

1)history模式使用createWebHistory():地址栏不带#

2)hash模式使用createWebHashHistory():地址栏带#

3)参数是基础路径,默认/

括号里的就是设置路径的前缀,此处是个变量,也可以设置固定值

import.meta.env.BASE_URL:vite中的环境变量

在vite.config.js文件中配置base设置import.meta.env.BASE_URL

详细参考:环境变量和模式 | Vite 官方中文文档

向前兼容vue2语法,比如在模板中使用$router.push('路径')也可以跳转,但是在js中使用this.$router.push('路径')不可以跳转,因为vue3中获取不到this

在Vue3 Composition中

import { useRouter, useRoute } from 'vue-router'

获取路由对象 router useRouter

const router=useRouter()

获取路由参数 route useRoute

const route=useRoute()

这样就可以用router.push('路径')来跳转页面了

相关文章:

Vue3-VueRouter4路由语法解析

1.创建路由实例由createRouter实现 2.路由模式 1)history模式使用createWebHistory():地址栏不带# 2)hash模式使用createWebHashHistory():地址栏带# 3)参数是基础路径,默认/ 括号里的就是设置路径的前…...

ChromeDriver最新版本下载与安装方法

关于ChromeDriver最新下载地址:https://googlechromelabs.github.io/chrome-for-testing/ 下载与安装 setp1:查看Chrome浏览器版本 首先,需要检查Chrome浏览器的版本。请按照以下步骤进行: 打开Chrome浏览器。 点击浏览器右上角…...

illuminate/database 使用 四

文档:Hyperf Database: Getting Started - Laravel 10.x - The PHP Framework For Web Artisans 因为hyperf使用illuminate/database,所以按照文章,看illuminate/database代码实现。 一、读写分离 根据文档读写的host可以分开。设置读写分…...

Spring面向切面编程(AOP);Spring控制反转(IOC);解释一下Spring AOP里面的几个名词;Spring 的 IoC支持哪些功能

文章目录 Spring面向切面编程(AOP)什么是AOPSpring AOP and AspectJ AOP 的区别?Spring AOP中的动态代理如何理解 Spring 中的代理?解释一下Spring AOP里面的几个名词Spring在运行时通知对象Spring切面可以应用5种类型的通知:什么是切面 Aspe…...

vatee万腾的科技征途:Vatee独特探索的数字化力量

在数字化时代的浪潮中,Vatee万腾以其独特的科技征途成为引领者。公司在数字化领域的探索之路不仅是技术的创新,更是一种对未知的勇敢涉足,是对新时代的深刻洞察和积极实践。 Vatee万腾通过独特的探索,展示了在数字化征途上的创新力…...

MySQL学习day03

一、SQL图形化界面工具 常用比较常用的图形化界面有sqlyog、mavicat、datagrip datagrip工具使用相当方便,功能比前面两种都要强大。 DataGrip工具的安装和使用请查看这篇文档:DataGrip 安装教程 DML-介绍 DML全称是Data Manipulation Language(数据…...

《QT从基础到进阶·三十七》QWidget实现左侧导航栏效果

NavigationBarPlugin插件类实现了对左侧导航栏的管理,我们可以在导航栏插件中添加界面,并用鼠标点击导航栏能够切换对应的界面。 源码在文章末尾 实现效果如下: NavigationBarPlugin实现的接口如下: class NAVIGATIONBAR_EXP…...

sftp学习

什么是sftp? sftp的简单操作 远程连接 int RobostSftp::Init(QString ip,QString port,QString user_name, QString user_password) { int rc;session ssh_new();if (!session) {fprintf(stderr, "ssh initialization failed\n");// return 1…...

C++之STL库:string类(用法列举和总结)

前言 大家在学习STL库的时候一定要学会看英文文档&#xff0c;俗话说熟能生巧&#xff0c;所以还得多练&#xff01;在使用string类之前&#xff0c;要包含头文件#include <string>和using namespace std; 文档链接&#xff1a;string - C Reference 一、string——构造…...

小程序中的大道理--综述

前言 以下将用一个小程序来探讨一些大道理, 这些大道理包括可扩展性, 抽象与封装, 可维护性, 健壮性, 团队合作, 工具的利用, 可测试性, 自顶向下, 分而治之, 分层, 可读性, 模块化, 松耦合, MVC, 领域模型, 甚至对称性, 香农的信息论等等. 为什么不用大程序来说大道理呢? …...

tlais智能学习辅助系统-修改部门功能实现

学习黑马程序员的JavaWeb课程&#xff0c;自己写的部门信息修改部分程序 控制层&#xff1a; //DeptController.java /** * 根据ID查询部门信息 * param id * return */ GetMapping("/{id}") public Result select(PathVariable Integer id){log.info("查询id…...

GLM: 自回归空白填充的多任务预训练语言模型

当前&#xff0c;ChatGLM-6B 在自然语言处理领域日益流行。其卓越的技术特点和强大的语言建模能力使其成为对话语言模型中的佼佼者。让我们深入了解 ChatGLM-6B 的技术特点&#xff0c;探索它在对话模型中的创新之处。 GLM: 自回归空白填充的多任务预训练语言模型 ChatGLM-6B 技…...

函数递归所应满足的条件

1.递归的概念 递归是学习C语⾔函数绕不开的⼀个话题&#xff0c;那什么是递归呢&#xff1f; 递归其实是⼀种解决问题的⽅法&#xff0c;在C语⾔中&#xff0c;递归就是函数⾃⼰调⽤⾃⼰。 递归的思想&#xff1a; 把⼀个⼤型复杂问题层层转化为⼀个与原问题相似&#xff0c;但…...

Python入职某新员工大量使用Lambda表达式,却被老员工喷是屎山

Python中Lambda表达式是一种简洁而强大的特性,其在开发中的使用优缺点明显,需要根据具体场景权衡取舍。 Lambda表达式的优点之一是它的紧凑语法,适用于一些短小而简单的函数。这种形式使得代码更为精炼,特别在一些函数式编程场景中,Lambda表达式可以提高代码的表达力。此外…...

Android Bitmap保存成至手机图片文件,Kotlin

Android Bitmap保存成至手机图片文件&#xff0c;Kotlin fun saveBitmap(name: String?, bm: Bitmap) {val savePath Environment.getExternalStoragePublicDirectory(Environment.DIRECTORY_PICTURES).toString()if (!Files.exists(Paths.get(savePath))) {Log.d("保存文…...

frp V0.52.3 搭建

下载 https://github.com/fatedier/frp/releases/ 此版本暂时没有windows的&#xff0c;想在windows使用请下载v0.52.2 简易搭建 frps.toml的配置文件&#xff0c;以下12000、8500需要在云服务器中的防火墙中开放tcp # bindPort为frps和frpc通信的端口&#xff0c;需要在防…...

最近数据分析面试的一点感悟...

我是阿粥&#xff0c;也是小z 最近面了不少应届的同学&#xff08;数据分析岗位&#xff09;&#xff0c;颇有感触&#xff0c;与各位分享。 简历可以润色&#xff0c;但要适度 运用一些原则&#xff0c;如STAR法则&#xff0c;让简历逻辑更清晰&#xff0c;条块分明&#xff0…...

ZYNQ_project:IIC_EEPROM

EEPROM简介&#xff1a; EEPROM(Electrically Erasable Progammable Read Only Memory&#xff0c; E2PROM)是指带电可擦可编程只读存 储器&#xff0c;是一种常用的非易失性存储器&#xff08;掉电数据不丢失&#xff09;&#xff0c; E2PROM 有多种类型的产品&#xff0c;我…...

Leetcode 2940. Find Building Where Alice and Bob Can Meet

Leetcode 2940. Find Building Where Alice and Bob Can Meet 1. 解题思路2. 代码实现3. 算法优化 题目链接&#xff1a;2940. Find Building Where Alice and Bob Can Meet 1. 解题思路 这一题本质上又是限制条件下求极值的问题&#xff0c;算是我最不喜欢的题目类型之一吧…...

C++ 泛型编程,函数模版和类模版

1.泛型编程 泛型编程&#xff1a;编写与类型无关的通用代码&#xff0c;是代码复用的一种手段。模板是泛型编程的基础 就比如说活字印刷术&#xff0c;就是提供一个模具&#xff0c;然后根据模具来印刷出不同的字。 泛型编程跟着类似&#xff0c;提供一个模版&#xff0c;根据这…...

【JavaEE】-- HTTP

1. HTTP是什么&#xff1f; HTTP&#xff08;全称为"超文本传输协议"&#xff09;是一种应用非常广泛的应用层协议&#xff0c;HTTP是基于TCP协议的一种应用层协议。 应用层协议&#xff1a;是计算机网络协议栈中最高层的协议&#xff0c;它定义了运行在不同主机上…...

Qt Widget类解析与代码注释

#include "widget.h" #include "ui_widget.h"Widget::Widget(QWidget *parent): QWidget(parent), ui(new Ui::Widget) {ui->setupUi(this); }Widget::~Widget() {delete ui; }//解释这串代码&#xff0c;写上注释 当然可以&#xff01;这段代码是 Qt …...

渗透实战PortSwigger靶场-XSS Lab 14:大多数标签和属性被阻止

<script>标签被拦截 我们需要把全部可用的 tag 和 event 进行暴力破解 XSS cheat sheet&#xff1a; https://portswigger.net/web-security/cross-site-scripting/cheat-sheet 通过爆破发现body可以用 再把全部 events 放进去爆破 这些 event 全部可用 <body onres…...

家政维修平台实战20:权限设计

目录 1 获取工人信息2 搭建工人入口3 权限判断总结 目前我们已经搭建好了基础的用户体系&#xff0c;主要是分成几个表&#xff0c;用户表我们是记录用户的基础信息&#xff0c;包括手机、昵称、头像。而工人和员工各有各的表。那么就有一个问题&#xff0c;不同的角色&#xf…...

华为OD机试-食堂供餐-二分法

import java.util.Arrays; import java.util.Scanner;public class DemoTest3 {public static void main(String[] args) {Scanner in new Scanner(System.in);// 注意 hasNext 和 hasNextLine 的区别while (in.hasNextLine()) { // 注意 while 处理多个 caseint a in.nextIn…...

【配置 YOLOX 用于按目录分类的图片数据集】

现在的图标点选越来越多&#xff0c;如何一步解决&#xff0c;采用 YOLOX 目标检测模式则可以轻松解决 要在 YOLOX 中使用按目录分类的图片数据集&#xff08;每个目录代表一个类别&#xff0c;目录下是该类别的所有图片&#xff09;&#xff0c;你需要进行以下配置步骤&#x…...

Angular微前端架构:Module Federation + ngx-build-plus (Webpack)

以下是一个完整的 Angular 微前端示例&#xff0c;其中使用的是 Module Federation 和 npx-build-plus 实现了主应用&#xff08;Shell&#xff09;与子应用&#xff08;Remote&#xff09;的集成。 &#x1f6e0;️ 项目结构 angular-mf/ ├── shell-app/ # 主应用&…...

Hive 存储格式深度解析:从 TextFile 到 ORC,如何选对数据存储方案?

在大数据处理领域&#xff0c;Hive 作为 Hadoop 生态中重要的数据仓库工具&#xff0c;其存储格式的选择直接影响数据存储成本、查询效率和计算资源消耗。面对 TextFile、SequenceFile、Parquet、RCFile、ORC 等多种存储格式&#xff0c;很多开发者常常陷入选择困境。本文将从底…...

LLMs 系列实操科普(1)

写在前面&#xff1a; 本期内容我们继续 Andrej Karpathy 的《How I use LLMs》讲座内容&#xff0c;原视频时长 ~130 分钟&#xff0c;以实操演示主流的一些 LLMs 的使用&#xff0c;由于涉及到实操&#xff0c;实际上并不适合以文字整理&#xff0c;但还是决定尽量整理一份笔…...

scikit-learn机器学习

# 同时添加如下代码, 这样每次环境(kernel)启动的时候只要运行下方代码即可: # Also add the following code, # so that every time the environment (kernel) starts, # just run the following code: import sys sys.path.append(/home/aistudio/external-libraries)机…...