uniapp APP端页面触发调用webview(页面为uniapp开发的H5)里的方法
原理:
使用 getCurrentInstance() 获取当前组件的 Vue 实例,通过 instance.proxy.$scope.$getAppWebview() 获取 Uniapp 的原生 WebView 对象。 使用 WebView 提供的 evalJS 方法,执行嵌入 H5 页面内的 JavaScript 代码
<template><view class="main"><view v-if="url" class="" style="width: 100%;height: 50vh;"><web-view @message="onMessageFromH5" id="webView" ref="webView" @error="onError" :src="url"></web-view></view></view>
</template>
function getData() {url.value = "http://192.168.0.22:5174/#/pages/orderDatelis/orderDatelis"orderDetails({id: orderId.value}).then(res => {const {end_latitude,end_longitude,id,start_latitude,start_longitude} = res.datasend(res.data)})}function send(data) {const json = JSON.stringify(data)if (instance) {const currentWebview = instance.proxy.$scope?.$getAppWebview();const wv = currentWebview.children()[0];wv.evalJS(`msgFromUniapp(${json})`);console.warn("发送");} else {console.warn('getCurrentInstance() returned null');}}
代码大意:调完接口后将接口返回参数注入webview
uniapp H5 webview部分:
onMounted(() => {window.msgFromUniapp = (res) => {send(res)try {data.value = resinitMap()} catch (e) {uni.showToast({title: e.message})send(e.message)}}})
相关文章:
uniapp APP端页面触发调用webview(页面为uniapp开发的H5)里的方法
原理: 使用 getCurrentInstance() 获取当前组件的 Vue 实例,通过 instance.proxy.$scope.$getAppWebview() 获取 Uniapp 的原生 WebView 对象。 使用 WebView 提供的 evalJS 方法,执行嵌入 H5 页面内的 JavaScript 代码 <template>&l…...
嵌入式知识点总结 C/C++ 专题提升(七)-位操作
针对于嵌入式软件杂乱的知识点总结起来,提供给读者学习复习对下述内容的强化。 目录 1.位操作基础 2.如何求解整型数的二进制表示中1的个数 ? 3.如何求解二进制中0的个数 4.交换两个变量的值,不使用第三个变量。即a3,b5,交换之后a5,b3: 5.给定一个…...
新星杯-ESP32智能硬件开发--ESP32的I/O组成
本博文内容导读📕🎉🔥 ESP32系统的基础外设开发:IO_MUX和GPIO矩阵 IO_MUX和GPIO矩阵 ESP32的I/O组成了与外部世界交互的基础,ESP32芯片有34个物理GPIO引脚。每个引脚都可用作一个通用I/O,或者连接一个内部…...
航空航天混合动力(7)航空航天分布式电推进系统
航空航天分布式电推进系统 1.概述2.分布式电推进系统组成3.关键技术4.分布式电推进系统优势5.国内外研究情况5.1 国外5.2 国内6.分布式电推进系统应用场景6.1 航空领域6.2 航天领域tips:资料来自网上,仅供参考学习使用 1.概述 分布式推进系统是指飞行器推力由位于整个航空器…...
AIGC视频生成明星——Emu Video模型
大家好,这里是好评笔记,公主号:Goodnote,专栏文章私信限时Free。本文详细介绍Meta的视频生成模型Emu Video,作为Meta发布的第二款视频生成模型,在视频生成领域发挥关键作用。 🌺优质专栏回顾&am…...
Cyber Security 101-Security Solutions-Firewall Fundamentals(防火墙基础)
了解防火墙并亲身体验 Windows 和 Linux 内置防火墙。 任务1:防火墙的用途是什么 我们看到商场、银行、 餐馆和房屋。这些警卫被安置在 这些区域用于检查进出人员。这 维护此检查的目的是确保没有人在没有 被允许。这个警卫充当了他所在区域和访客之间的一堵墙。 …...
备赛蓝桥杯之第十五届职业院校组省赛第一题:智能停车系统
提示:本篇文章仅仅是作者自己目前在备赛蓝桥杯中,自己学习与刷题的学习笔记,写的不好,欢迎大家批评与建议 由于个别题目代码量与题目量偏大,请大家自己去蓝桥杯官网【连接高校和企业 - 蓝桥云课】去寻找原题࿰…...
Docker核心命令与Yocto项目的高效应用
随着软件开发逐渐向分布式和容器化方向演进,Docker 已成为主流的容器化技术之一。它通过标准化的环境配置、资源隔离和高效的部署流程,大幅提高了开发和构建效率。Yocto 项目作为嵌入式 Linux 系统构建工具,与 Docker 的结合进一步增强了开发…...
idea plugin插件开发——入门级教程(IntelliJ IDEA Plugin)
手打不易,如果转摘,请注明出处! 注明原文:idea plugin插件开发——入门级教程(IntelliJ IDEA Plugin)-CSDN博客 目录 前言 官方 官方文档 代码示例 开发前必读 Intellij、Gradle、JDK 版本关系 plu…...
61,【1】BUUCTF WEB BUU XSS COURSE 11
进入靶场 左边是吐槽,右边是登录,先登录试试 admin 123456 admiin# 123456 admin"# 123456 不玩了,先去回顾下xss 回顾完就很尴尬了,我居然用SQL的知识去做xss的题 重来 吐槽这里有一个输入框,容易出现存储型…...
开发环境搭建-1:配置 WSL (类 centos 的 oracle linux 官方镜像)
一些 Linux 基本概念 个人理解,并且为了便于理解,可能会存在一些问题,如果有根本上的错误希望大家及时指出 发行版 WSL 的系统是基于特定发行版的特定版本的 Linux 发行版 有固定组织维护的、开箱就能用的 Linux 发行版由固定的团队、社…...
Spring Boot MyBatis Plus 版本兼容问题(记录)
Spring Boot & MyBatis Plus 版本兼容问题(Invalid value type for attribute factoryBeanObjectType: java.lang.String) 问题描述问题排查1. 检查 MapperScan 的路径2. 项目中没有配置 FactoryBean3. 检查 Spring 和 MyBatis Plus 版本兼容性 解决…...
26. 【.NET 8 实战--孢子记账--从单体到微服务】--需求更新--用户注销、修改用户名、安全设置
在实际开发过程中,项目需求的变更和增加是常见的情况,因此这篇文章我们就模拟一下项目需求新增的情况。 一、需求 项目经理今天提出了新的功能,需要增加重置密码、安全设置、修改用户名、注销账户这四个功能,这四个功能必须是独…...
神经网络|(一)加权平均法,感知机和神经元
【1】引言 从这篇文章开始,将记述对神经网络知识的探索。相关文章都是学习过程中的感悟和理解,如有雷同或者南辕北辙的表述,请大家多多包涵。 【2】加权平均法 在数学课本和数理统计课本中,我们总会遇到求一组数据平均值的做法…...
OpenHarmony OTA升级参考资料记录
OpenHarmony 作为一个开源分布式操作系统,通过其强大的 OTA(Over-The-Air)升级能力,为开发者和厂商提供了一套灵活而安全的系统升级方案。 OTA升级方式 根据升级包的应用方式,OpenHarmony 的 OTA 升级可以分为两种:本地升级和网络OTA升级。 本地升级 本地升级是将已制作…...
在 Kubernetes 上快速安装 KubeSphere v4.1.2
目录标题 安装文档配置repo安装使用插件 安装文档 在 Kubernetes 上快速安装 KubeSphere 配置repo export https_proxy10.10.x.x:7890 helm repo add stable https://charts.helm.sh/stable helm repo update安装 helm upgrade --install -n kubesphere-system --create-name…...
【回忆迷宫——处理方法+DFS】
题目 代码 #include <bits/stdc.h> using namespace std; const int N 250; int g[N][N]; bool vis[N][N]; int dx[4] {0, 0, -1, 1}; int dy[4] {-1, 1, 0, 0}; int nx 999, ny 999, mx, my; int x 101, y 101; //0墙 (1空地 2远方) bool jud(int x, int y) {if…...
华为OD机试真题---战场索敌
华为OD机试真题“战场索敌”是一道考察算法和数据结构应用能力的题目。以下是对该题目的详细解析: 一、题目描述 有一个大小是NM的战场地图,被墙壁’#‘分隔成大小不同的区域。上下左右四个方向相邻的空地’.‘属于同一个区域,只有空地上可…...
计算机网络 (53)互联网使用的安全协议
一、SSL/TLS协议 概述: SSL(Secure Sockets Layer)安全套接层和TLS(Transport Layer Security)传输层安全协议是工作在OSI模型应用层的安全协议。SSL由Netscape于1994年开发,广泛应用于基于万维网的各种网络…...
c++算法贪心系列
本篇文章,同大家一起学习贪心算法!!! 第一题 题目链接 2208. 将数组和减半的最少操作次数 - 力扣(LeetCode) 题目解析 本题重点:最终的数组和要小于原数组和的一半,且求这一操作的…...
MPNet:旋转机械轻量化故障诊断模型详解python代码复现
目录 一、问题背景与挑战 二、MPNet核心架构 2.1 多分支特征融合模块(MBFM) 2.2 残差注意力金字塔模块(RAPM) 2.2.1 空间金字塔注意力(SPA) 2.2.2 金字塔残差块(PRBlock) 2.3 分类器设计 三、关键技术突破 3.1 多尺度特征融合 3.2 轻量化设计策略 3.3 抗噪声…...
C++实现分布式网络通信框架RPC(3)--rpc调用端
目录 一、前言 二、UserServiceRpc_Stub 三、 CallMethod方法的重写 头文件 实现 四、rpc调用端的调用 实现 五、 google::protobuf::RpcController *controller 头文件 实现 六、总结 一、前言 在前边的文章中,我们已经大致实现了rpc服务端的各项功能代…...
python/java环境配置
环境变量放一起 python: 1.首先下载Python Python下载地址:Download Python | Python.org downloads ---windows -- 64 2.安装Python 下面两个,然后自定义,全选 可以把前4个选上 3.环境配置 1)搜高级系统设置 2…...
剑指offer20_链表中环的入口节点
链表中环的入口节点 给定一个链表,若其中包含环,则输出环的入口节点。 若其中不包含环,则输出null。 数据范围 节点 val 值取值范围 [ 1 , 1000 ] [1,1000] [1,1000]。 节点 val 值各不相同。 链表长度 [ 0 , 500 ] [0,500] [0,500]。 …...
Java-41 深入浅出 Spring - 声明式事务的支持 事务配置 XML模式 XML+注解模式
点一下关注吧!!!非常感谢!!持续更新!!! 🚀 AI篇持续更新中!(长期更新) 目前2025年06月05日更新到: AI炼丹日志-28 - Aud…...
vue3 定时器-定义全局方法 vue+ts
1.创建ts文件 路径:src/utils/timer.ts 完整代码: import { onUnmounted } from vuetype TimerCallback (...args: any[]) > voidexport function useGlobalTimer() {const timers: Map<number, NodeJS.Timeout> new Map()// 创建定时器con…...
ardupilot 开发环境eclipse 中import 缺少C++
目录 文章目录 目录摘要1.修复过程摘要 本节主要解决ardupilot 开发环境eclipse 中import 缺少C++,无法导入ardupilot代码,会引起查看不方便的问题。如下图所示 1.修复过程 0.安装ubuntu 软件中自带的eclipse 1.打开eclipse—Help—install new software 2.在 Work with中…...
在鸿蒙HarmonyOS 5中使用DevEco Studio实现录音机应用
1. 项目配置与权限设置 1.1 配置module.json5 {"module": {"requestPermissions": [{"name": "ohos.permission.MICROPHONE","reason": "录音需要麦克风权限"},{"name": "ohos.permission.WRITE…...
全面解析各类VPN技术:GRE、IPsec、L2TP、SSL与MPLS VPN对比
目录 引言 VPN技术概述 GRE VPN 3.1 GRE封装结构 3.2 GRE的应用场景 GRE over IPsec 4.1 GRE over IPsec封装结构 4.2 为什么使用GRE over IPsec? IPsec VPN 5.1 IPsec传输模式(Transport Mode) 5.2 IPsec隧道模式(Tunne…...
Maven 概述、安装、配置、仓库、私服详解
目录 1、Maven 概述 1.1 Maven 的定义 1.2 Maven 解决的问题 1.3 Maven 的核心特性与优势 2、Maven 安装 2.1 下载 Maven 2.2 安装配置 Maven 2.3 测试安装 2.4 修改 Maven 本地仓库的默认路径 3、Maven 配置 3.1 配置本地仓库 3.2 配置 JDK 3.3 IDEA 配置本地 Ma…...
