uniapp webview实现双向通信
需求：uniapp webview嵌套一个h5 实现双向通信
- uniapp 代码
<template><view><web-view src="http://192.168.3.150:9003/" @message="onMessage"></web-view></view>
</template><script>export default {data(){return{currentWebview:null}},mounted() {const self = this;self.currentWebview = self.$scope.$getAppWebview().children()[0]let info = {name:'hello'}self.currentWebview.evalJS(`uniEvent(${JSON.stringify(info)})`);setInterval(() => {self.currentWebview.evalJS(`uniEvent(${JSON.stringify(info)})`);},1000)},methods: {onMessage(e) {console.log('来自页面的消息', e.detail.data);uni.showToast({title: e.detail.data, icon: 'none'});}}}
</script>
- h5 页面代码
<!DOCTYPE html>
<html>
<head><meta http-equiv="content-type" content="text/html; charset=utf-8" /><title>测试</title><script type="text/javascript" src="https://js.cdn.aliyun.dcloud.net.cn/dev/uni-app/uni.webview.1.5.2.js"></script>
</head>
<body onload="addUniEvenPassthrough()"><div class="margin-top:200px;"></div><button onclick="sendMessage()">Send message to uniapp</button><button onclick="sendMessage()">Send message to uniapp</button><button onclick="sendMessage()">Send message to uniapp</button><button onclick="sendMessage()">Send message to uniapp</button><button onclick="sendMessage()">Send message to uniapp</button><button onclick="sendMessage()">Send message to uniapp</button><button onclick="sendMessage()">Send message to uniapp</button><script>function sendMessage() {uni.postMessage({data: 'Hello from web page!'});}function addUniEvenPassthrough() {window.uniEvent = function(info) {console.log('webview通信', JSON.stringify(info));}}</script>
</body>
</html>
- 效果
相关文章：
uniapp webview实现双向通信
需求：uniapp webview嵌套一个h5 实现双向通信 uniapp 代码 <template><view><web-view src"http://192.168.3.150:9003/" message"onMessage"></web-view></view> </template><script>export defau…...
Linux动态库
定义：动态函数库，是在程序执行时动态（临时）由目标程序去调用 优点： 调用时不复制，程序运行时动态加载到内存，供程序调用，系统只加载一次，多个程序可以共用，…...
ESP-IDF学习——1.环境安装与hello-world
ESP-IDF学习——1.环境安装与hello-world 0.前言一、环境搭建1.官方IDE工具2.vscode图形化配置 二、示例工程三、自定义工程四、点灯五、总结 0.前言 最近在学习freertos，但由于买的书还没到，所以先捣鼓捣鼓ESP-IDF，因为这个比Arduino更接近底…...
【算法】二分答案
文章目录 相关链接什么时候使用二分答案？题目列表最大化最小化相关题目列表📕2439. 最小化数组中的最大值解法1——二分答案解法2——分类讨论O(n) 2513. 最小化两个数组中的最大值（二分答案lcm容斥原理）🐂好题&#x…...
阿曼市场最全开发攻略，看这一篇就够了
中东是一个充满外贸机遇的市场，已经成为很多外贸人重点开发的市场。 阿曼的海岸南方和东方临阿拉伯海，东北方则抵阿曼湾。阿曼因为扼守着世界上最重要的石油输出通道——波斯湾和阿曼湾之间的霍尔木兹海峡，所以地理位置非常重要，…...
探讨UUID和Secrets：确保唯一性与数据安全的利器
😀前言 在现代软件开发中，唯一标识符（UUID）和机密信息的处理是至关重要的。UUID是用于唯一标识数据记录和对象的128位值，确保了全球范围内的唯一性。同时，Python的secrets模块为处理机密信息提供了强大的随…...
06-Redis缓存高可用集群
上一篇：05-Redis高可用集群之水平扩展 1.集群方案比较 哨兵模式 在redis3.0以前的版本要实现集群一般是借助哨兵sentinel工具来监控master节点的状态，如果master节点异常，则会做主从切换，将某一台slave作为master，…...
LCP 18.早餐组合
题目来源： leetcode题目，网址：LCP 18. 早餐组合 - 力扣（LeetCode） 解题思路： 按序遍历饮料数组，二分查找符合要求 staple 中满足要求的最大值所在位置。最后返回所有*（最大位置…...
Tomcat调优【精简版】
Tomcat调优 优化Tomcat内存分配 调整Tomcat启动脚本contalina.sh,设置tomcat启动时分配的内存很可使用的最大内存; CATALINA_OPTS 调整Tomcat线程池 Tomcat默认使用的线程池:ThreadPoolExecutor 可以通过修改server.xml的 Connector 节点下的 maxThreads、minSpareThread…...
通过NDK编译C程序运行在iMX6q开发板上
在之前想要在Ubuntu系统中编译c语言程序为可执行文件并放在装有Android6.0.1系统的imx6q开发板上运行，采用gcc编译器进行编译的时候，虽然可以生成可执行文件但是却出现了错误，最终采用手段仍然无法在板子上运行，但是转换思路后&am…...
【学习笔记】Java 一对一培训（2.1）Java基础语法
【学习笔记】Java 一对一培训（2.1）Java基础语法 关键词：Java、Spring Boot、Idea、数据库、一对一、培训、教学本文主要内容含Java简介、Java基础语法、Java对象和类、Java基本数据类型、Java变量类型、Java修饰符计划2小时完成，…...
外贸独立站哪家好？推荐的独立站建站平台？
如何选外贸独立站搭建系统？创建贸易网站的工具有哪些？ 在如今全球贸易不断蓬勃发展的背景下，外贸独立站成为许多企业拓展国际市场的首选之一。然而，要想在竞争激烈的市场中脱颖而出，选择一家合适的外贸独立站服务提供…...
六、变量与常量
变量与常量 1.变量与常量1.1标识符和关键字1.1.1.标识符1.1.2.关键字 1.2.声明变量1.3.声明常量1.4.变量的有效范围1.4.1.成员变量1.4.2.局部变量 1.5.训练11.6.训练2 —————————————————————————————————————————————————— …...
Fork() 函数：“父” 与 “子” 进程的交互（进程的创建）
阅读导航 前言一、fork函数初识1. 基本概念2. fork函数返回值 二、fork函数的写时拷贝三、总结温馨提示 前言 前面我们讲了C语言的基础知识，也了解了一些数据结构，并且讲了有关C的一些知识，也学习了一些Linux的基本操作，也了解并…...
JupyterNotebook设置Python环境的方法步骤
不多说，看链接。 https://stackoverflow.com/questions/39604271/conda-environments-not-showing-up-in-jupyter-notebook conda activate myenv pip install ipykernel python -m ipykernel install --user --name myenv --display-name "Python (myenv)&q…...
腾讯云阿里云云服务器 Linux 操作系统 BT 宝塔面板快速建站教程
宝塔面板概述 宝塔面板是一款服务器管理软件，支持Windows和Linux系统，可以通过Web端轻松管理服务器，提升运维效率。总体来说，宝塔面板具有操作简单、功能丰富、安全可靠等特点，是一款非常实用的服务器管理软件。 宝塔…...
【Linux】死锁理解
什么是死锁 因为资源调度的方式不合理或者资源的稀缺性，导致进程间的相互等待。 死锁的四个必要条件：互斥条件，请求和保持条件，环路等待条件，不可剥夺条件。 死锁的预防只要破坏死锁产生的四个必要条件。通常采用预…...
基于Java所涉及的人工智能的框架
11 References: [1] Java中人工智能的框架_永远的12的博客-CSDN博客...
【力扣】三角形最小路径和
目录 题目 例子 示例 1： 示例 2： 前言 思路 思想 代码 调用的函数 主函数 所有代码 力扣提交的代码 运行结果 小结 题目 给定一个三角形 triangle ，找出自顶向下的最小路径和。 每一步只能移动到下一行中相邻的结点上。相邻的结…...
【Linux】指针常量和常量指针
这个是指针常量，不能修改指向【其实就是引用的原型】：可以理解为const是否限制了星号 这个是常量指针，可以改指向，不能改值：...
Go 语言接口详解
Go 语言接口详解 核心概念 接口定义 在 Go 语言中，接口是一种抽象类型，它定义了一组方法的集合： // 定义接口 type Shape interface {Area() float64Perimeter() float64 } 接口实现 Go 接口的实现是隐式的： // 矩形结构体…...
重启Eureka集群中的节点，对已经注册的服务有什么影响
先看答案，如果正确地操作，重启Eureka集群中的节点，对已经注册的服务影响非常小，甚至可以做到无感知。 但如果操作不当，可能会引发短暂的服务发现问题。 下面我们从Eureka的核心工作原理来详细分析这个问题。 Eureka的…...
HarmonyOS运动开发：如何用mpchart绘制运动配速图表
##鸿蒙核心技术##运动开发##Sensor Service Kit（传感器服务）# 前言 在运动类应用中，运动数据的可视化是提升用户体验的重要环节。通过直观的图表展示运动过程中的关键数据，如配速、距离、卡路里消耗等，用户可以更清晰…...
关于uniapp展示PDF的解决方案
在 UniApp 的 H5 环境中使用 pdf-vue3 组件可以实现完整的 PDF 预览功能。以下是详细实现步骤和注意事项： 一、安装依赖 安装 pdf-vue3 和 PDF.js 核心库： npm install pdf-vue3 pdfjs-dist二、基本使用示例 <template><view class"con…...
Rust 开发环境搭建
环境搭建 1、开发工具RustRover 或者vs code 2、Cygwin64 安装 https://cygwin.com/install.html 在工具终端执行： rustup toolchain install stable-x86_64-pc-windows-gnu rustup default stable-x86_64-pc-windows-gnu 2、Hello World fn main() { println…...
Vue ③-生命周期 || 脚手架
生命周期 思考：什么时候可以发送初始化渲染请求？（越早越好） 什么时候可以开始操作dom？（至少dom得渲染出来） Vue生命周期： 一个Vue实例从 创建 到 销毁 的整个过程。 生命周期四个…...
Sklearn 机器学习 缺失值处理 获取填充失值的统计值
💖亲爱的技术爱好者们，热烈欢迎来到 Kant2048 的博客！我是 Thomas Kant，很开心能在CSDN上与你们相遇～💖 本博客的精华专栏： 【自动化测试】 【测试经验】 【人工智能】 【Python】 使用 Scikit-learn 处理缺失值并提取填充统计信息的完整指南 在机器学习项目中，数据清…...
boost::filesystem::path文件路径使用详解和示例
boost::filesystem::path 是 Boost 库中用于跨平台操作文件路径的类，封装了路径的拼接、分割、提取、判断等常用功能。下面是对它的使用详解，包括常用接口与完整示例。 1. 引入头文件与命名空间 #include <boost/filesystem.hpp> namespace fs b…...
Python的__call__ 方法
在 Python 中，__call__ 是一个特殊的魔术方法（magic method），它允许一个类的实例像函数一样被调用。当你在一个对象后面加上 () 并执行时（例如 obj()），Python 会自动调用该对象的 __call__ 方法…...
背包问题双雄：01 背包与完全背包详解（Java 实现）
一、背包问题概述 背包问题是动态规划领域的经典问题，其核心在于如何在有限容量的背包中选择物品，使得总价值最大化。根据物品选择规则的不同，主要分为两类： 01 背包：每件物品最多选 1 次（选或不选&#…...