vue3 cdn 的方式 ,通过 URLSearchParams 来获取参数的信息。

1、CDN的方式引用相关js

<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>授权结果</title>
	<script src="https://unpkg.com/vue@3.4.27/dist/vue.global.prod.js"></script>
	<script src="https://unpkg.com/dayjs/dayjs.min.js"></script>
	<script src="https://unpkg.com/dayjs/plugin/customParseFormat.js"></script>
	<script src="https://unpkg.com/dayjs/plugin/weekday.js"></script>
	<script src="https://unpkg.com/dayjs/plugin/localeData.js"></script>
	<script src="https://unpkg.com/dayjs/plugin/weekOfYear.js"></script>
	<script src="https://unpkg.com/dayjs/plugin/weekYear.js"></script>
	<script src="https://unpkg.com/dayjs/plugin/advancedFormat.js"></script>
	<script src="https://unpkg.com/dayjs/plugin/quarterOfYear.js"></script>
	<link type="text/css" href="https://unpkg.com/ant-design-vue@4.2.3/dist/reset.css" media="screen" rel="stylesheet">
	<script src="https://unpkg.com/ant-design-vue@4.2.3/dist/antd.min.js"></script>
	<script src="https://unpkg.com/axios/dist/axios.min.js"></script>

2、Result.html 获取参数的值

onMounted(() => {
					const queryString = new URLSearchParams(window.location.search);
					msg.value = queryString.get('msg');
});

注意:在传msg之前要encode下

例如:

@RequestMapping(path = "/myQrcode", method = RequestMethod.GET)
	public ModelAndView MyQrcode(@RequestParam(name = "msg", required = true) String msg, HttpServletRequest req,
			HttpServletResponse resp) {
		ModelAndView modelView = new ModelAndView();
		modelView.setViewName("Result");
		modelView.addObject("msg", msg);
		System.out.println(JSON.toJSONString(modelView));
		return modelView;
	}
try {
            String msg = "绑定成功";
			msg = URLEncoder.encode(msg,"utf-8");
		} catch (UnsupportedEncodingException e) {
			e.printStackTrace();
		}
import java.net.URLEncoder;

3、encode的参数,页面收到以后会自动decode,也就是会输出绑定成功。

4、URLSearchParams事例:

const paramsString = "q=URLUtils.searchParams&topic=api";
const searchParams = new URLSearchParams(paramsString);

// 迭代查询参数
for (let p of searchParams) {
  console.log(p);
}

console.log(searchParams.has("topic")); // true
console.log(searchParams.has("topic", "fish")); // false
console.log(searchParams.get("topic") === "api"); // true
console.log(searchParams.getAll("topic")); // ["api"]
console.log(searchParams.get("foo") === null); // true
console.log(searchParams.append("topic", "webdev"));
console.log(searchParams.toString()); // "q=URLUtils.searchParams&topic=api&topic=webdev"
console.log(searchParams.set("topic", "More webdev"));
console.log(searchParams.toString()); // "q=URLUtils.searchParams&topic=More+webdev"
console.log(searchParams.delete("topic"));
console.log(searchParams.toString()); // "q=URLUtils.searchParams"

https://developer.mozilla.org/zh-CN/docs/Web/API/URLSearchParams

详细的请参考上面的链接地址。


 

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

《简历宝典》02 - 如果你是HR,你会优先打开哪份简历?

现在的求职环境不必多说&#xff0c;其实我们大家都还是很清楚的。所以&#xff0c;在这个环境下&#xff0c;写一份优秀的简历&#xff0c;目的与作用也不必多说。那么&#xff0c;这一小节呢&#xff0c;我们先从简历这份文档的文档名开始说起。 目录 1 你觉得HR们刷简历的时…

【SVN的使用-源代码管理工具-命令行的使用 Objective-C语言】

一、接下来,我们来说一个终端的命令行的使用, 1.我们说,你的电脑里边呢,有终端, 在Mac里边,你想新建一个txt,应该怎么写,对,打开文本编辑, 打开这个东西,写点儿东西,然后保存一下,保存的时候,你还要去选择格式, 现在,如果我们用命令行,可以更方便一些, 2.首…

企业用私户发工资算不算偷税?

一般来说&#xff0c;给员工发工资都是用企业的对公账户去发&#xff0c;但是&#xff0c;有的企业会用私户去发工资&#xff0c;早前就有蜜雪冰城股东用私户给员工发奖金被税局稽查&#xff0c;最终补缴个税近800万的新闻&#xff0c;可见&#xff0c;私户发工资是具有很大风险…

上海时尚新品发布会,可以邀请哪些媒体

传媒如春雨&#xff0c;润物细无声&#xff0c;大家好&#xff0c;我是51媒体网胡老师。 在上海举办时尚新品发布会时&#xff0c;可以邀请的媒体类型多样&#xff0c;以下是一些建议的媒体类型及其特点&#xff1a; 一、平面媒体 报纸&#xff1a; 《文汇报》&#xff1a;上…

底层软件 | 十分详细,为了学习设备树,我写了5w字笔记!

0、设备树是什么&#xff1f;1、DTS 1.1 dts简介1.2 dts例子 2、DTC&#xff08;Device Tree Compiler&#xff09;3、DTB&#xff08;Device Tree Blob&#xff09;4、绑定&#xff08;Binding&#xff09;5、Bootloader compatible属性 7、 #address-cells和#size-cells属性8…

Qt源码解析之QObject

省去大部分virtual和public方法后&#xff0c;Qobject主要剩下以下成员&#xff1a; //qobject.h class Q_CORE_EXPORT Qobject{Q_OBJECTQ_PROPERTY(QString objectName READ objectName WRITE setObjectName NOTIFY objectNameChanged)Q_DECLARE_PRIVATE(QObject) public:Q_I…

印章谁在管、谁用了、用在哪?契约锁让您打开手机一看便知

“印章都交给谁在管”、“哪些人能用”、“都有哪些业务在用”…这些既是管理者最关心的印章问题也是影响印章安全的关键要素。但是公司旗下分子公司那么多&#xff0c;各类公章、法人章、财务章、合同章一大堆&#xff0c;想“问”明白很难。 契约锁电子签及印控平台推出“印章…

OpenLayers使用2

接着上一篇https://blog.csdn.net/weixin_51416826/article/details/140161160?spm1001.2014.3001.5502 本篇主要内容是基于高德API逆向地址解析获取城市中心点&#xff0c;并且设置了输入框&#xff0c;可以输入城市执行飞行&#xff0c;同时基于高德API获取城市天气信息&am…

【漏洞复现】万户协同办公平台——反序列化

声明&#xff1a;本文档或演示材料仅供教育和教学目的使用&#xff0c;任何个人或组织使用本文档中的信息进行非法活动&#xff0c;均与本文档的作者或发布者无关。 文章目录 漏洞描述漏洞复现测试工具 漏洞描述 万户协同办公平台ezEIP是一个综合信息基础应用平台&#xff0c;…

Leaflet【六】绘制交互图形、测量、经纬度展示

本文主要探讨了如何利用leaflet-draw插件在地图上绘制图形&#xff0c;以及通过leaflet-measure测量距离和面积&#xff0c;并将经纬度绘制到地图上。首先&#xff0c;我们使用leaflet-draw插件&#xff0c;该插件提供了一种简单而直观的方式来绘制各种形状&#xff08;如点、线…

配置基于不同IP地址的虚拟主机

定义配置文件vhost.conf <directory /www> allowoverride none require all granted </directory> <virtualhost 192.168.209.136:80> documentroot /www servername 192.168.209.136 </virtualhost><virtualhost 192.168.209.138:80> document…

Restore Equipment

Restore Equipment 魔兽世界 - 盗号申请 - 恢复装备流程 魔兽和网易真的不行啊 1&#xff09;这个装备本来就是兑换的竟然可以卖NPC 2&#xff09;针对这个情况竟然无法挽回 3&#xff09;设计理念真的不得不吐槽一下 4&#xff09;策划真的不咋样&#xff0c;要是有机会我要自…

STM32F1+HAL库+FreeTOTS学习5——内核中断管理及中断控制函数

STM32F1HAL库FreeTOTS学习5——中断管理和临界段代码保护 中断简介中断优先级寄存器拓展FreeRTOS中PendSV和Systick中断优先级配置三个中断屏蔽寄存器FreeRTOS中断管理函数代码验证 上一期我们学习了FreeRTOS中任务挂起与恢复&#xff0c;在中断服务程序中恢复任务过程中&#…

Fish Speech: 开源文本转语音技术(TTS)的新里程碑

简介 Fish Speech 是一个全新的文本转语音(TTS)解决方案&#xff0c;该项目由fishaudio开发。当前模型使用约十五万小时三语数据训练&#xff0c;对中文支持非常的完美。 能够熟练处理和生成中文、日语和英语的语音&#xff0c;语言处理能力接近人类水平&#xff0c;并且声音…

狂赚三个亿,百亿医用耗材上市公司重金押注老人轮椅

布局海外市场&#xff0c;轮椅销量翻两番 作者 | 艾米莉 排版 | 张思琪 抛砖引玉 1.年销售60万台轮椅&#xff0c;英科医疗如何做到&#xff1f; 2.老年人轮椅是出海&#xff0c;还是深耕国内市场&#xff1f; 3.2022年全球轮椅市场规模为48亿美元&#xff0c;谁在喝汤&…

Android仿天眼查人物关系图

效果图预览 绘制思路 这里使用了中学解析几何知识 XPoint OPointX OPointXcosθ&#xff1b; YPoint OPointY OPointYsinθ&#xff1b; canvas.drawText(lists.get(i).getName(), XPoint (float) Math.cos(pere * i 5) * radius[i % radius.length] - 30, YPoint (fl…

【笔试记录】腾讯音乐 | 20230903 | cpp (更新ing)

1 完美数 1.1 题目描述 小红定义一个数为“完美数”&#xff0c;当且仅当该数仅有一个非零数字。例如 5000, 4, 1, 10, 200 都是完美数。 小红拿到了一个大小为 n&#xff08;2 < n < 2000&#xff09;的数组 a&#xff0c;她希望选择数组中的两个元素&#xff08;1 …

CVE-2023-30212(xss漏洞)

简介 OURPHP版本<7.2.0存在XSS漏洞&#xff0c;攻击路径为/client/manage/ourphp_out.php。 过程 打开靶场 访问攻击路径/client/manage/ourphp_out.php 得到flag{354c7c41-cc23-4de5-be73-79cbbf384aba}

上海计算机考研炸了,这所学校慎报!上海大学计算机考研考情分析!

上海大学&#xff08;Shanghai University&#xff09;&#xff0c;简称“上大”&#xff0c;是上海市属、国家“211工程”重点建设的综合性大学&#xff0c;教育部与上海市人民政府共建高校&#xff0c;国防科技工业局与上海市人民政府共建高校&#xff0c;国家“双一流”世界…

leetcode--二叉搜索子树的最大键值和

leetcode地址&#xff1a;二叉搜索子树的最大键值和 给你一棵以 root 为根的 二叉树 &#xff0c;请你返回 任意 二叉搜索子树的最大键值和。 二叉搜索树的定义如下&#xff1a; 任意节点的左子树中的键值都 小于 此节点的键值。 任意节点的右子树中的键值都 大于 此节点的键值…