vue3 window.location 获取正在访问的地址,也可以通过useRoute来获取相关信息。

devtools/2024/10/18 7:56:28/

1、一般我们在开发的vue3项目的时候,地址是这样:http://192.168.1.101:3100/#/login

然后我们在布署完成以后一般是这样https://xxx.yyyyy.com/uusys/#/login

其实xxx可以是www,也可以是一个二级域名

yyyyy.com是域名,uusys一般是虚拟目录,当然也可以省略这个看你如何布署及处理域名了。

2、window.location 给出的信息如下:

可以看到:href是完整的地址,如果你要重新赋值href就可以改变访问路径

下面是基本的路径显示,根据实际情况我们就可以处理成自己想要的路径了。

import { useRoute, useRouter } from 'vue-router';export default {setup() {const route = useRoute(); // 获取当前路由对象const router = useRouter(); // 获取路由器对象// 获取当前路由的完整地址const currentPath = window.location.pathname;// 如果需要获取当前路由的路径const currentRoutePath = route.path;// 如果需要获取查询参数const queryParams = route.query;// 如果需要获取hash值const currentHash = window.location.hash;// 如果需要获取主机名const hostName = window.location.hostname;// 如果需要获取端口号const port = window.location.port;// 如果需要获取协议const protocol = window.location.protocol;return {currentPath,currentRoutePath,queryParams,currentHash,hostName,port,protocol};}
};

上面代码,来自baidu。


http://www.ppmy.cn/devtools/56440.html

相关文章

Dubbo 3.x源码(22)—Dubbo服务引用源码(5)服务引用bean的获取以及懒加载原理

基于Dubbo 3.1,详细介绍了Dubbo服务的发布与引用的源码。 此前我们学习了Dubbo3.1版本的服务引入的总体流程,当然真正的服务远程引入、以及配置迁移啥的都还没讲,但是本次我们先不接着讲MigrationRuleListener#onRefer方法,而是先…

【2024.6.23】今日科技时事:科技前沿大事件

人不走空 🌈个人主页:人不走空 💖系列专栏:算法专题 ⏰诗词歌赋:斯是陋室,惟吾德馨 目录 🌈个人主页:人不走空 💖系列专栏:算法专题 ⏰诗词歌…

适配器模式(Adapter Pattern)

适配器模式(Adapter Pattern) 定义 它的功能是将一个类的接口变成客户端锁期望的另一种接口,从而使原本因接口不匹配而导致无法在一起工作的两个类能够一起工作。 属于结构型设计模式。 适用场景 已经存在的类,它的方法和需求…

AI 与 Python 实战干货:基于深度学习的图像识别

《AI 与 Python 实战干货:基于深度学习的图像识别》 今天咱不啰嗦,直接上干货! 在 AI 领域,特别是图像识别方面,Python 简直是一把利器。咱就以手写数字识别为例,来看看怎么用 Python 实现一个深度学习模…

电通出席2024年世界经济论坛(WEF),重申推动可持续发展创新和人才培育的承诺

中国,上海——电通将出席世界经济论坛2024年新领军者年会(夏季达沃斯),本次大会将于6月25日至6月27日在中国大连举行。 2024年世界经济论坛主题为“未来增长的新前沿”,将聚焦于全球经济复苏、通胀缓解,以…

嵌入式linux系统中动态链接库实现详解

大家好,linux系统中动态库是如何实现相互链接的?今天简单聊聊动态链接库的实现原理。 假设有这样两段代码,第一段代码定义了一个全量变量a以及函数foo,函数foo中引用了下一段代码中定义的全局变量b。 第二段代码定义了全局变量b以及main函数,同时在main函数中调用了第一个…

WebSockets 完全指南:在 Postman 中测试实时通信

标题:WebSockets 完全指南:在 Postman 中测试实时通信 摘要 Postman 是 API 开发者广泛使用的工具,支持 RESTful API 的测试和调试。随着实时通信的兴起,WebSockets 协议变得日益重要。本文将详细介绍如何在 Postman 中测试 Web…

信号与系统、数字信号处理及通信原理课程深度解析与资源推荐

信号与系统、数字信号处理及通信原理课程深度解析与资源推荐 在电子工程、通信技术和计算机科学领域,信号与系统、数字信号处理和通信原理是三门至关重要的课程。它们不仅为学生提供了坚实的理论基础,也为后续的专业学习和工作实践奠定了坚实的基础。本…