鸿蒙实现 web 传值

前言:安卓和 IOS 加载 H5 的时候,都有传值给到 H5 或者接收 H5 值,鸿蒙也可传值和接收 H5 的内容,以下是鸿蒙传值给 H5 端的具体操作

一: 定义好 H5 和鸿蒙传值的方法名,两端必须保持方法名一致

// xxx.ets

import { webview } from '@kit.ArkWeb'

//和 H5 定义的传输内容

class TestObj {

constructor() {

}

test(data1: string, data2: string, data3: string): string {

console.log("data1:" + data1)

console.log("data2:" + data2)

console.log("data3:" + data3)

return "AceString"

}

toString(): void {

console.log('toString' + "interface instead.")

}

}

@Entry

@Component

struct Index {

@State message: string = 'Hello World'

controller: webview.WebviewController = new webview.WebviewController()

testObj = new TestObj();

build() {

Row() {

Column() {

Web({ src: $rawfile('index.html'), controller: this.controller })

.javaScriptAccess(true)

.javaScriptProxy({

object: this.testObj, // 传输的内容

name: "objName", // H5 定义的传值方法名

methodList: "test", "toString","goBack", // 具体的方法

controller: this.controller,

})

}.width('100%')

}.height('100%')

}

}

复制代码
// H5 页面返回
goBack() {
  router.back()
}
相关推荐
b1305381004910 分钟前
HarmonyOS应用开发实战:萌宠日记 - 环比增长指示器
harmonyos·鸿蒙
爱写代码的森16 分钟前
鸿蒙三方库 | harmony-utils之LocationUtil位置获取与订阅详解
华为·harmonyos·鸿蒙·huawei
吃糖的小孩25 分钟前
从只读页面到可控真实探针:我如何给 Owner Console 加手动诊断
前端
谷无姜26 分钟前
为什么你的性能优化无效?可能是"木桶效应"在作祟
前端·性能优化
雾非雾29 分钟前
《基于具身交互智能数字人技术:如何打造AI数字人宣讲平台"红厅智播”》
前端
Revolution6138 分钟前
一段 JavaScript 代码执行时,到底发生了什么
前端·javascript
Helen_cai38 分钟前
OpenHarmony API23 四层模块化脚手架完整实现(含全套工具源码)
华为·harmonyos
智能起源40 分钟前
关于元素层级过多,导致压祯的问题(使用winform或者WPF应用的webview组件嵌套网页时,动效卡顿问题)
前端
qizayaoshuap1 小时前
# [特殊字符] 指南针 — 鸿蒙ArkTS方向计算与方位跟踪系统
华为·harmonyos
达子6661 小时前
第5章_图解harmonyos Ability基础知识
华为·harmonyos