鴻蒙與web混合開發雙向通信

鴻蒙與web混合開發雙向通信用runJavaScript和registerJavaScriptProxy
web
entry/src/main/resources/rawfile/1.html

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>混合開發</title>
</head>
<body><div></div><img src="./a.png" alt=""><button onclick="selectImg()">打開相冊</button>
</body>
</html>
<script>//直接寫js代碼function changeImg(){//1.獲取img這個元素const img = document.querySelector('img')//2.修改元素的屬性img.src = './b.png'}async function selectImg(){//通知鴻蒙,讓鴻蒙設備打開相冊const res = await harmonyDevice.selectImage()const div = document.querySelector('div')div.innerText = JSON.stringify(res)}</script>

鴻蒙

import { webview } from '@kit.ArkWeb'
import { photoAccessHelper } from '@kit.MediaLibraryKit'
import { promptAction } from '@kit.ArkUI'@Entry
@Component
struct Page {webController:WebviewController = new webview.WebviewController()selectImg(){const picker = new photoAccessHelper.PhotoViewPicker()return picker.select()}build() {Column(){// 1.想讓網頁干嘛,直接調網頁的JS方法Button('鴻蒙-改變網頁圖片').onClick(()=>{// 控制器this.webController.runJavaScript('changeImg()')})// 2.網頁控制鴻蒙測Button('注入鴻蒙的事件').onClick(()=>{promptAction.showToast({message:'注入成功'})// 1.先給網頁一個對象,這個對象上包含了所有網頁要用到的方法集合// 2.給這個對象起一個名字,讓網頁可以使用這個對象// 3.確定網頁可以使用的方法集合this.webController.registerJavaScriptProxy({selectImage:async()=>{const res = await this.selectImg()return res}},"harmonyDevice",["selectImage"])})// 1.加載的地址// 2.控制Button('刷新頁面').onClick(()=>{this.webController.refresh()})Web({// 本地:src:$rawfile('1.html'),// src:'https://www.amap.com/',controller:this.webController})}.width('100%').height('100%')}
}

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/diannao/91862.shtml
繁體地址,請注明出處:http://hk.pswp.cn/diannao/91862.shtml
英文地址,請注明出處:http://en.pswp.cn/diannao/91862.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

unity Physics.RaycastNonAlloc

Physics.RaycastNonAlloc 是 Unity 中用于 3D 物理射線檢測的高性能方法&#xff0c;它是 Physics.Raycast 的非分配版本。 方法簽名 public static int RaycastNonAlloc(Ray ray, RaycastHit[] results, float maxDistance Mathf.Infinity, int layerMask DefaultRaycastLay…

數據庫(five day finally)——物物而不物于物,念念而不念于念。(數據庫到此結束!祝世間美好與各位不期而遇,善意常伴汝身!)

1.子查詢&#xff08;1&#xff09;where 子查詢①多行單列配合in和not in操作&#xff08;類似于數據范圍查詢&#xff09;例&#xff1a;顯示工資與各個經理相同的雇員信息&#xff08;包含經理本身&#xff09;。select * from empwhere sal(select sal from emp where jobM…

【甲烷數據集】Sentinel-5P 衛星獲取的全球甲烷數據集-TROPOMI L2 CH?

目錄 數據概述 傳感器 & 衛星信息 監測目標:甲烷(CH?) 數據產品內容 空間與時間覆蓋 云篩選與協同觀測 技術文檔資源 數據下載 Python 代碼繪制 CH4 數據 參考 數據概述 Sentinel-5 Precursor Level 2 Methane (TROPOMI L2 CH?) 數據集是由歐洲哥白尼計劃的 Sentinel…

【數據結構】單鏈表練習(有環)

1.判斷是否是環形鏈表 141. 環形鏈表 - 力扣&#xff08;LeetCode&#xff09; bool hasCycle(struct ListNode *head) {struct ListNode *fast,*slow;fastslowhead;while(fast&&fast->next){fastfast->next->next;slowslow->next;if(fastslow)return tr…

VR 污水廠初體驗:顛覆傳統認知?

第一次戴上 VR 設備走進 VR 污水廠時&#xff0c;那種震撼的感覺至今難以忘懷。仿佛一瞬間&#xff0c;我被傳送到了一個全新的世界&#xff0c;平日里只能在圖紙或實地看到的污水廠&#xff0c;此刻就立體地呈現在眼前。腳下是縱橫交錯的管道&#xff0c;頭頂巨大的處理設備有…

父類 div 自適應高度 子類如何撐滿其高度

使用絕對定位 如果你想要子元素完全撐滿父元素的高度&#xff0c;可以使用絕對定位。這種方法適用于當子元素需要完全覆蓋父元素時。<div class"parent"><div class"child"><!-- 子類內容 --></div> </div>.parent {positio…

從0開始學習R語言--Day51--PH檢驗

在用cox回歸做分析時&#xff0c;我們一般會得出各種變量在結局的風險影響&#xff08;HR大于1&#xff0c;就代表變量值增大&#xff0c;對應結局影響的風險就隨之增大&#xff09;&#xff0c;但是這里有個壞處是&#xff0c;cox回歸得到的是瞬時風險值&#xff0c;我們最多得…

Docker 網絡原理

Linux 常見網絡虛擬化 虛擬網卡:tun/tap虛擬網卡&#xff08;又稱虛擬網絡適配器&#xff09;&#xff0c;即用軟件模擬網絡環境&#xff0c;模擬網絡適配器。在計算機網絡中&#xff0c;tun 與 tap 是操作系統內核中的虛擬網絡設備。不同于普通靠硬件網絡適配器實現的設備&…

【通識】PCB文件

1. PCB文件的導入 在PORTEL99 PCB編輯器的文件菜單中選擇導入先前繪制的CAD文件。導入成功后&#xff0c;編輯器將顯示出元件封裝的基本圖形&#xff0c;為后續操作奠定基礎。將需要抄板的PCB放置于掃描儀中隨后啟動掃描儀&#xff0c;之后啟動AUTO CAD軟件&#xff0c;之后插入…

分布式彈性故障處理框架——Polly(1)

1 前言之服務雪崩 在我們實施微服務之后&#xff0c;服務間的調用變得異常頻繁&#xff0c;多個服務之前可能存在互相依賴的關系&#xff0c;當某個服務出現故障或者是因為服務間的網絡出現故障&#xff0c;導致服務調用的失敗&#xff0c;進而影響到某個業務服務處理失敗&…

【機器學習深度學習】大模型推理速度與私有化部署的價值分析

目錄 前言 一、主流推理框架速度對比 二、為什么 HuggingFace 框架更適合微調驗證&#xff1f; 三、大模型私有化部署的必要性分析 ? 私有化部署的主要動因 1. 數據隱私與業務安全 2. 可控性與性能保障 ? 哪些情況不建議私有部署&#xff1f; 四、總結與選型建議 &…

elementui-admin構建

1、vue-element-admin vue-element-admin是基于element-ui 的一套后臺管理系統集成方案。 功能&#xff1a;介紹 | vue-element-adminA magical vue adminhttps://panjiachen.github.io/vue-element-admin-site/zh/guide/# GitHub地址&#xff1a;https://github.com/PanJia…

深入排查:編譯環境(JDK)與運行環境(JRE/JDK)不一致時的常見 Java 錯誤及解決方案

深入排查&#xff1a;編譯環境&#xff08;JDK&#xff09;與運行環境&#xff08;JRE/JDK&#xff09;不一致時的常見 Java 錯誤及解決方案 在后端 Java 項目中&#xff0c;編譯環境&#xff08;JDK&#xff09; 與 運行環境&#xff08;JRE/JDK&#xff09; 版本不一致&…

[JS逆向] 微信小程序逆向工程實戰

博客配套代碼與工具發布于github&#xff1a;微信小程序 &#xff08;歡迎順手Star一下?&#xff09; 相關爬蟲專欄&#xff1a;JS逆向爬蟲實戰 爬蟲知識點合集 爬蟲實戰案例 逆向知識點合集 前言&#xff1a; 微信小程序對于很多嘗試JS逆向的人群來說&#xff0c;都是一個…

基于5G系統的打孔LDPC編碼和均勻量化NMS譯碼算法matlab性能仿真

目錄 1.引言 2.算法仿真效果演示 3.數據集格式或算法參數簡介 4.算法涉及理論知識概要 4.1打孔技術 4.2 均勻量化NMS譯碼 5.參考文獻 6.完整算法代碼文件獲得 1.引言 在5G通信系統中&#xff0c;信道編碼技術是保障高速率、高可靠性數據傳輸的核心支撐&#xff0c;而低…

基于Java標準庫讀取CSV實現天地圖POI分類快速導入PostGIS數據庫實戰

目錄 前言 一、天地圖POI分類簡介 1、數據表格 2、分類結構 二、從CSV導入到PG數據庫 1、CSV解析流程 2、數據轉換及入庫 3、入庫成果及檢索 三、總結 前言 在之前的博客中&#xff0c;曾經對高德地圖和百度地圖的POI分類以及使用PostGIS數據庫來進行管理的模式進行了詳…

人-AI交互中的信息論不同于傳統的信息論,其信息的增量≠不確定性的減量

在人機交互&#xff08;Human-AI Interaction, HAI&#xff09;領域&#xff0c;信息論的應用確實與傳統的信息論有所不同。這種差異主要源于人機交互HAI中信息的復雜性、動態性以及人類認知的特點。1. 傳統信息論的核心概念傳統信息論由克勞德香農&#xff08;Claude Shannon&…

K8s 通過 Scheduler Extender 實現自定義調度邏輯

1. 為什么需要自定義調度邏輯 什么是所謂的調度? 所謂調度就是指給 Pod 對象的 spec.nodeName 賦值 待調度對象則是所有 spec.nodeName 為空的 Pod 調度過程則是從集群現有的 Node 中為當前 Pod 選擇一個最合適的 實際上 Pod 上還有一個平時比較少關注的屬性&#xff1a;…

7.19 換根dp | vpp |滑窗

lcr147.最小棧通過兩個棧 維護實現class MinStack { public:stack<int> A, B;MinStack() {}void push(int x) {A.push(x);if(B.empty() || B.top() > x)B.push(x);}void pop() {if(A.top() B.top())B.pop();A.pop();}int top() {return A.top();}int getMin() {retur…

以太坊的心臟與大腦:詳解執行客戶端(EL)與共識客戶端(CL)

好的&#xff0c;各位技術同道&#xff0c;歡迎再次光臨我的博客。在上一篇文章中&#xff0c;我們聊了如何搭建一個以太坊測試節點&#xff0c;并提到了節點需要同時運行“執行客戶端”和“共識客戶端”。很多朋友對此表示了濃厚興趣&#xff0c;想深入了解這兩者究竟是什么&a…