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

混合App开发实现页面跳转(更新中)

util.js

/*** 这个函数被用来获取 URL 中的查询参数,并将它们以对象(键值对)的形式返回* @param {string} url* @returns {object} oParams*/
export function getUrlQuery(url = null) {let sUrl = url || window.location.href;let oParams = {};//创建一个空对象,用于存储解析后的查询参数let reg = /([^?&=]+)=([^?&=]+)/g;//([^?&=]+):这是第一个捕获组,匹配不包含 ?、& 和 = 的连续字符,该正则表达式可以匹配到两个键值对:foo=bar 和 baz=123let res = reg.exec(sUrl);while (res) {oParams[res[1]] = res[2];//将匹配结果中的第一个元素作为键,第二个元素作为值,添加到 oParams 对象中res = reg.exec(sUrl);//继续执行正则表达式匹配,查找下一个查询参数键值对}return oParams;
}/*** 这个函数用于设置 URL 的查询参数,并返回新的带有更新查询参数的 URL* @param {*object} oParamName 参数名和参数值* @param {*string} sURL*/
export function setUrlQuery(params, URL) {let preParams = getUrlQuery(URL);let oParamName = { ...preParams, ...params };//将原始查询参数和传入的新参数合并let oURL = URL || window.location.href;let sURL = oURL.split('?')[0];let sParam;//保存每个查询参数的字符串形式sURL.match(/\?/) ? (sURL += '&') : (sURL += '?');//检查 URL 是否已经包含问号(?),如果包含则在末尾添加 &,否则添加 ?for (let x in oParamName) {if (oParamName[x] !== 0 && !oParamName[x]) continue;//检查当前查询参数的值是否为非空或非零。如果为空或零,则跳过该查询参数sParam = String(x) + '=' + oParamName[x] + '&';//将当前查询参数拼接成字符串形式,格式为 键=值&sURL += sParam;//将当前查询参数字符串追加到 URL 的末尾}sURL = sURL ? sURL.slice(0, -1) : sURL;//如果 URL 不为空,则删除最后一个字符(即多余的 & 或 ?)console.log(sURL);return sURL;
}// 判断是否在APP内isInApp = () => {let userAgent = navigator.userAgent.toLocaleLowerCase();if (userAgent.indexOf('xxxxx') > -1) {//移动端浏览器通常提供了更灵活的方式来修改 User Agent 字符串return true;}return false;};

adapter.js

/**** @param {*} params 跳转参数,router所需参数* @param {*} appOptions APP内跳转需要额外设置的参数*/openNewWebPage = (params, appOptions = {}, isOuterPage = false) => {console.log(params);if (this.isInApp()) {let sUrl = '';if (isOuterPage) {sUrl = params.path;} else {sUrl = window.location.origin + BASE_URL + params.path;}sUrl = setUrlQuery(params.query, sUrl);window.BasilicaNativeJS.invoke('openNewWebPage', {isHideNav: false,titleColor: 'ffffff',barTintColor: '5d3eff',tintColor: '5d3eff',isScrollGradient: false,url: sUrl,...appOptions,});} else {if (isOuterPage) {let sUrl = params.path;sUrl = setUrlQuery({ ...getUrlQuery(sUrl), ...params.query }, sUrl);window.location.href = sUrl;} else {let sUrl = params.path;params.query = { ...getUrlQuery(sUrl), ...params.query };router.push(params);}}};

page.js

import { setUrlQuery,getUrlQuery } from './adapter.js';const params = {param2: 'new-value2',param3: 'value3',
};
const url='https://example.com/page?param1=value1&param2=value2';
const updatedURL = setUrlQuery(params,url);
console.log(updatedURL);
//https://example.com/page?param1=value1&param2=new-value2&param3=value3const getUrl = getUrlQuery('https://example.com/?foo=bar&baz=123');
console.log(getUrl);
//{ foo: 'bar', baz: '123' }

相关文章:

混合App开发实现页面跳转(更新中)

util.js /*** 这个函数被用来获取 URL 中的查询参数,并将它们以对象(键值对)的形式返回* param {string} url* returns {object} oParams*/ export function getUrlQuery(url null) {let sUrl url || window.location.href;let oParams {…...

【FPGA】Verilog:BCD 加法器的实现

0x00 XOR 运算在 2 的补码加减法中的应用 2 的补码加减法的特点是,当从某个数中减去负数时,将其转换为正数的加法来计算,并将减去正数的情况转换为负数的加法来计算,从而将所有减法运算转换为加法运算。在这种情况下,…...

机器学习第15天:GBDT模型

☁️主页 Nowl 🔥专栏《机器学习实战》 《机器学习》 📑君子坐而论道,少年起而行之 ​​ 文章目录 GBDT模型介绍 Boosting 残差 GBDT的缺点 python代码实现 代码 模型参数解释 结语 GBDT模型介绍 GBDT(Gradient Boos…...

STM32F407-14.3.9-01输出比较模式

输出比较模式 此功能用于控制输出波形,或指示已经过某一时间段。 当捕获/比较寄存器与计数器之间相匹配时,输出比较功能: ● 将为相应的输出引脚分配一个可编程值,该值由输出比较模式(TIMx_CCMRx 寄存器中的 OCxM⑦…...

LeetCode题:174. 地下城游戏

目录 一、题目要求 二、解题思路 (1)状态表示 (2)状态转移方程 (3)初始化dp表 (4)填表顺序 (5)返回值 三、代码 一、题目要求 174. 地下城游戏 恶魔们…...

CSS、JS文件无法正确加载至页面问题与解决

目录 1. 问题出现 2. 分析与解决 3. 总结 1. 问题出现 自己在写项目是时候,想启动浏览器查询首页面index.jsp的显示效果 预期效果应该是下面这样的: 但是实际上是这样的: 意思也就是说可能是关于CSS、JS相关的引入方面出了问题&#xff…...

ftp的服务安装配置

安装 yum install -y vsftpd # 是否安装成功 rpm -qa | grep vsftpd # 是否开机启动 systemctl list-unit-files | grep vsftpd # 开机启动 systemctl enable vsftpd.service # ftp端口 netstat -antup | grep ftp # 状态 service vsftpd status service vsftpd start service…...

原码,补码,反码(极简版)

原码补码反码 都有符号位,0表示正数,1表示负数 正数 正数的原码,补码,反码都相同 负数 负数的原码,最高位是1,其余的用正常二进制表示 负数的反码,对原码进行符号位不变,其余位…...

uniapp监听wifi连接状态

在uniapp中检测WiFi连接状态可以使用uni的API进行操作。 uni.onNetworkStatusChange((res) > { console.log(res)uni.getConnectedWifi({success: function(res) {console.log(已连接WIFI, res);},fail: function(err) {console.log(未连接WIFI, err);}}); }) 此函数将返回…...

2023年总结和2024年展望(以ue为主攻)

2023年就要过去了,总结下: 先说好的地方 1,pbr材质集成到了osg中,加上直接光和间接光。终于知道pbr咋回事了。光线追踪的视频也跟着敲了一个。 2,得到了认可。拿到了半年奖,leader让我明年和架构师一起进行…...

南京大学计算机学院面试准备

该内容是我面试南京大学计算机学院保研的时候的准备题目,最后是面试的时候问到的问题。 目录 1. 自我介绍2. 进程和线程的区别3. 循环引用4. 操作系统怎么利用多核?5. 英文介绍二叉搜索树6. 英文介绍二叉搜索树的时间复杂度7. 介绍 stackover flow8. 什…...

API成批分配漏洞介绍与解决方案

一、API成批分配漏洞介绍 批量分配:在API的业务对象或数据结构中,通常存在多个属性,攻击者通过篡改属性值的方式,达到攻击目的。比如通过设置user.is_admin和user.is_manager的值提升用户权限等级;假设某API的默认接口…...

跨网文件摆渡系统:安全、可控的数字传输桥梁

在企业高度信息化的时代,数据的流通与共享已经成为企业、组织乃至个人之间不可或缺的沟通方式。然而,在数据流通的过程中,我们经常会遇到各种难题和挑战,尤其是当涉及到不同网络环境之间的文件传输。这不仅需要保证文件的安全性&a…...

线程池的原理和基本使用~

线程池的基本原理: 无论是之前在JavaSE基础中,我们学习过的常量池,还是在操作数据库时,我们学习过数据库连接池,以及接下来要学习的线程池,均是一种池化思想,其目的就是为了提高资源的利用率&a…...

PyTorch2.0环境搭建

一、安装python并配置环境变量 1、打开python官网,下载并安装 Welcome to Python.org 下载 寻找版本:推荐使用3.9版本,或其他表中显示为安全(security)的版本 安装:(略) 2、配置环…...

figma 基础使用 —— 常用方法

一、 导入组件 分成两种方式 (1)离线的包导入(iOS 常用组件.fig 直接拖拽到figma最近网页) (2)在插件市场下载https://www.figma.com/community 二、figma中使用标尺 快捷键:shift R 三、插件…...

linux rsync 和scp区别

rsync 和 scp 都是 Linux 中用于文件复制的命令,但它们之间存在一些关键差异: 效率:rsync 在复制文件时,只会复制文件中改变的部分,而 scp 则会复制整个文件,即使文件只有一小部分发生了变化。因此&#xf…...

mac如何永久设置环境变量

1. 先将默认shell修改为bash mac修改默认shell为bash-CSDN博客 2. 修改环境变量 Mac中的环境变量介绍 Mac系统的环境变量,加载顺序为: /etc/profile /etc/paths ~/.bash_profile ~/.bash_login ~/.profile ~/.bashrc 当然/etc/profile和/etc/paths…...

小程序一键生成工具哪个好?

在这个数字化时代,小程序已经成为商家吸引客户、提升业务的重要工具。但是,传统的小程序开发方式既费时又费力,让许多商家望而却步。 现在,有了乔拓云小程序模板开发平台,一切都变了。 乔拓云提供了大量精心设计的模板…...

Ubuntu环境下使用nginx实现强制下载静态资源

安装Nginx sudo apt update sudo apt install nginx关闭防火墙 sudo ufw allow Nginx HTTP修改nginx配置 cd /etc/nginx/conf.d vi nginx.conf在http配置中添加(/your path/为需要下载的文件路径) server {listen 80;server_name localhost;location / {root /your path/…...

第19节 Node.js Express 框架

Express 是一个为Node.js设计的web开发框架,它基于nodejs平台。 Express 简介 Express是一个简洁而灵活的node.js Web应用框架, 提供了一系列强大特性帮助你创建各种Web应用,和丰富的HTTP工具。 使用Express可以快速地搭建一个完整功能的网站。 Expre…...

国防科技大学计算机基础课程笔记02信息编码

1.机内码和国标码 国标码就是我们非常熟悉的这个GB2312,但是因为都是16进制,因此这个了16进制的数据既可以翻译成为这个机器码,也可以翻译成为这个国标码,所以这个时候很容易会出现这个歧义的情况; 因此,我们的这个国…...

在软件开发中正确使用MySQL日期时间类型的深度解析

在日常软件开发场景中,时间信息的存储是底层且核心的需求。从金融交易的精确记账时间、用户操作的行为日志,到供应链系统的物流节点时间戳,时间数据的准确性直接决定业务逻辑的可靠性。MySQL作为主流关系型数据库,其日期时间类型的…...

树莓派超全系列教程文档--(62)使用rpicam-app通过网络流式传输视频

使用rpicam-app通过网络流式传输视频 使用 rpicam-app 通过网络流式传输视频UDPTCPRTSPlibavGStreamerRTPlibcamerasrc GStreamer 元素 文章来源: http://raspberry.dns8844.cn/documentation 原文网址 使用 rpicam-app 通过网络流式传输视频 本节介绍来自 rpica…...

MySQL 隔离级别:脏读、幻读及不可重复读的原理与示例

一、MySQL 隔离级别 MySQL 提供了四种隔离级别,用于控制事务之间的并发访问以及数据的可见性,不同隔离级别对脏读、幻读、不可重复读这几种并发数据问题有着不同的处理方式,具体如下: 隔离级别脏读不可重复读幻读性能特点及锁机制读未提交(READ UNCOMMITTED)允许出现允许…...

vscode(仍待补充)

写于2025 6.9 主包将加入vscode这个更权威的圈子 vscode的基本使用 侧边栏 vscode还能连接ssh? debug时使用的launch文件 1.task.json {"tasks": [{"type": "cppbuild","label": "C/C: gcc.exe 生成活动文件"…...

理解 MCP 工作流:使用 Ollama 和 LangChain 构建本地 MCP 客户端

🌟 什么是 MCP? 模型控制协议 (MCP) 是一种创新的协议,旨在无缝连接 AI 模型与应用程序。 MCP 是一个开源协议,它标准化了我们的 LLM 应用程序连接所需工具和数据源并与之协作的方式。 可以把它想象成你的 AI 模型 和想要使用它…...

el-switch文字内置

el-switch文字内置 效果 vue <div style"color:#ffffff;font-size:14px;float:left;margin-bottom:5px;margin-right:5px;">自动加载</div> <el-switch v-model"value" active-color"#3E99FB" inactive-color"#DCDFE6"…...

聊一聊接口测试的意义有哪些?

目录 一、隔离性 & 早期测试 二、保障系统集成质量 三、验证业务逻辑的核心层 四、提升测试效率与覆盖度 五、系统稳定性的守护者 六、驱动团队协作与契约管理 七、性能与扩展性的前置评估 八、持续交付的核心支撑 接口测试的意义可以从四个维度展开&#xff0c;首…...

分布式增量爬虫实现方案

之前我们在讨论的是分布式爬虫如何实现增量爬取。增量爬虫的目标是只爬取新产生或发生变化的页面&#xff0c;避免重复抓取&#xff0c;以节省资源和时间。 在分布式环境下&#xff0c;增量爬虫的实现需要考虑多个爬虫节点之间的协调和去重。 另一种思路&#xff1a;将增量判…...