vue-router 路由模式有几种?

Vue Router 提供了三种路由模式:

1:Hash 模式(默认):

在 URL 中使用带有 # 符号的哈希值来管理路由。例如:http://xxxx.com/#/path。
在 Hash 模式下,当 URL 的哈希值发生变化时,浏览器不会向服务器发送请求,而是通过监听 hashchange 事件来进行路由导航。

2:History 模式:

使用 HTML5 的 History API 来管理路由。这种模式下,URL 不再需要使用哈希值,而是直接使用正常的 URL 地址。例如:http://xxxx.com/path。
在 History 模式下,当 URL 发生变化时,浏览器会向服务器发送请求,服务器需要配置相应的路由规则,以确保在刷新页面或直接访问 URL 时能正确响应路由。

3:Abstract 模式:

这种模式主要用于非浏览器环境,比如在服务器端渲染(Server-Side Rendering)时使用。
在 Abstract 模式下,Vue Router 不会对 URL 进行任何处理,而是将路由信息保存在内存中,通过编程方式进行路由导航。

可以通过创建 Vue Router 实例时的 mode 配置项来选择使用哪种路由模式。例如:

const router = new VueRouter({mode: 'history', // 使用 History 模式routes: [...]
})

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

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

相关文章

k8s day06

污点通常情况下是作用在worker节点上,其可以影响Pod的调度。 污点的语法格式如下: key[value]:effect 相关字段说明: key: 字母或数字开头,可以包含字母、数字、连字符(-)、点(.)和下划线(_),最多253个字符。 …

Leetcode54螺旋矩阵

代码&#xff1a; class Solution {public List<Integer> spiralOrder(int[][] matrix) {List<Integer> res new ArrayList<>();if(matrixnull||matrix.length0||matrix[0].length0)return res;int left0,rightmatrix[0].length-1,up0,down matrix.length…

使用guacamole进行WEB远程桌面连接

Apache Guacamole 是一个无客户端的远程桌面网关。它支持标准协议&#xff0c;如 VNC、RDP 和 SSH&#xff0c;甚至还支持k8s、telnet连接。它可以在任何有网络的地方连接上你的服务器和Windows主机。可以同时连接多个终端&#xff0c;并且能够无缝切换。本文采用docker进行部署…

数据结构与算法(十):动态规划与贪心算法

参考引用 Hello 算法 Github&#xff1a;hello-algo 1. 动态规划算法 动态规划将一个问题分解为一系列更小的子问题&#xff0c;并通过存储子问题的解来避免重复计算&#xff0c;从而大幅提升时间效率 问题&#xff1a;给定一个共有 n 阶的楼梯&#xff0c;你每步可以上 1 阶或…

【王道代码】【2.3链表】d1

关键字&#xff1a; 递归删除x&#xff1b;删除所有x&#xff1b;递归反向输出&#xff1b;删除最小结点&#xff08;2组指针&#xff09;&#xff1b;原地逆置&#xff1b;使递增有序

2008-2021年上市公司实体企业金融化程度测算数据(原始数据+stata代码)

2008-2021年上市公司实体企业金融化程度测算&#xff08;原始数据stata代码&#xff09; 1、时间&#xff1a;2008-2021年 2、指标&#xff1a;股票代码、年份、交易性金融资产、衍生金融资产、发放贷款及垫款净额、可供出售金融资产净额、持有至到期投资净额、长期债权投资净…

github 终端克隆操作,以及对 https/ssh 的理解

前言 最近瞎搞 github 的一些配置&#xff0c;结果搞得有一段时间克隆不了仓库。不过经历了这次风波后&#xff0c;我对 github 的一些原理有了更清楚的了解。所以想稍微写一小篇文章总结输出一下&#xff0c;也欢迎有疑问的读者与博主进一步交流&#xff0c;我的理解还是有限…

我的发布.

<!DOCTYPE html> <html><head><title>我的发布</title><meta http-equiv"content-type" content"text/html; charsetutf-8"/><meta name"apple-mobile-web-app-capable" content"yes"/><…

[1Panel]开源,现代化,新一代的 Linux 服务器运维管理面板

测评介绍 本期测评试用一下1Panel这款面板。1Panel是国内飞致云旗下开源产品。整个界面简洁清爽&#xff0c;后端使用GO开发&#xff0c;前端使用VUE的Element-Plus作为UI框架&#xff0c;整个面板的管理都是基于docker的&#xff0c;想法很先进。官方还提供了视频的使用教程&…

【SA8295P 源码分析 (四)】23 - QNX Ethernet MAC 驱动 之 emac1_config.conf 配置文件解析

【SA8295P 源码分析】23 - QNX Ethernet MAC 驱动 之 emac1_config.conf 配置文件解析 系列文章汇总见:《【SA8295P 源码分析 (四)】网络模块 文章链接汇总 - 持续更新中》 本文链接:《【SA8295P 源码分析 (四)】23 - QNX Ethernet MAC 驱动 之 emac1_config.conf 配置文件解…

mysql 指定库对所有表加tenant_id

mysql 指定库里所有表加tenant_id 由于业务所需&#xff0c;区分公司主体&#xff0c;tenant_id油然而生 但库里表至少几百个&#xff0c;不可能一个一个去加&#xff0c;时间成本&#xff0c;人力成本都很大&#xff0c;所以写一个存储过程函数&#xff0c;对其进行一次性操作…

leetcode:2678. 老人的数目(python3解法)

难度&#xff1a;简单 给你一个下标从 0 开始的字符串 details 。details 中每个元素都是一位乘客的信息&#xff0c;信息用长度为 15 的字符串表示&#xff0c;表示方式如下&#xff1a; 前十个字符是乘客的手机号码。接下来的一个字符是乘客的性别。接下来两个字符是乘客的年…

leetcode:217. 存在重复元素(先排序再比较邻位)

一、题目&#xff1a; 函数原型&#xff1a; bool containsDuplicate(int* nums, int numsSize) 参数分析&#xff1a; nums是传入的数组 numsSize是传入数组的元素个数 二、思路&#xff1a; 根据题意&#xff0c;判断数组中是否存在出现两次以上的元素。可以先将数组排序&…

基于混沌博弈优化的BP神经网络(分类应用) - 附代码

基于混沌博弈优化的BP神经网络&#xff08;分类应用&#xff09; - 附代码 文章目录 基于混沌博弈优化的BP神经网络&#xff08;分类应用&#xff09; - 附代码1.鸢尾花iris数据介绍2.数据集整理3.混沌博弈优化BP神经网络3.1 BP神经网络参数设置3.2 混沌博弈算法应用 4.测试结果…

【汇编语言特别篇】DOSBox及常用汇编工具的详细安装教程

文章目录 &#x1f4cb;前言一. ⛳️dosbox的介绍、下载和安装1.1 &#x1f514;dosbos简介1.2 &#x1f514;dosbox的下载1.2.1 &#x1f47b;方式一&#xff1a;官网下载(推荐)1.2.2 &#x1f47b;方式二&#xff1a;网盘安装包 1.3 &#x1f514;dosbox的安装1.4 &#x1f5…

CSS 滚动驱动动画 timeline-scope

timeline-scope 语法兼容性 timeline-scope 看到 scope 就知道这个属性是和范围有关, 没错, timeline-scope 就是用来修改一个具名时间线(named animation timeline)的范围. 我们介绍过的两种时间线 scroll progress timeline 和 view progress timeline, 使用这两种时间线(通…

TCP/IP网络分层模型

TCP/IP当初的设计者真的是非常聪明&#xff0c;创造性地提出了“分层”的概念&#xff0c;把复杂的网络通信划分出多个层次&#xff0c;再给每一个层次分配不同的职责&#xff0c;层次内只专心做自己的事情就好&#xff0c;用“分而治之”的思想把一个“大麻烦”拆分成了数个“…

Linux篇 五、Ubuntu与Linux板卡建立NFS服务

Linux系列文章目录 一、香橙派Zero2设置开机连接wifi 二、香橙派Zero2获取Linux SDK源码 三、香橙派Zero2搭建Qt环境 四、Linux修改用户名 文章目录 Linux系列文章目录前言一、连接到局域网互ping测试 二、安装NFS服务配置NFS更新exports配置三、板卡安装NFS客户端四、板卡临时…

LINUX | hexdump以16进制查看文件内容

LINUX | hexdump以16进制查看文件内容 时间&#xff1a;2023-10-20 文章目录 LINUX | hexdump以16进制查看文件内容1.参考2.示例1.以ASCII字符显示文件中字符2.以16进制和相应的ASCII字符显示文件里的字符3.只显示文件中前n个字符4.以偏移量开始格式输出 1.参考 1.Linux命令–h…

前端 js 经典:递归

1. 什么是递归 函数内部调用自己&#xff0c;这就是递归 2. 为什么用递归 对数据进行处理&#xff0c;优化处理流程可以用递归 3. 构成递归三要素&#xff08;必须&#xff09; 3.1 参数递归逻辑&#xff1a;如下例&#xff0c;demo(n-1)对比 demo(n)参数递归逻辑为 n-1 …