鸿蒙(HarmonyOS)应用开发——web组件

2023-12-13 03:42:31

简述

在开发的工作中,可能存在一个场景,我们有一个问卷调查的h5页面,需要切入到app 中。这个时候,就需要从app 端操作,切换到web端操作。不管是安卓、ios、小程序都提供有web组件。那么harmonyos 中也提供web组件来在应用内加载浏览器

语法

web(options:{src:string, controller?:WebController})

src

设置网页资源地址,可以是本地资源,也可以是网络资源;

  • 本地资源
    src:$rawfile(‘index.html’)
  • 网络资源
    网络资源需添加网络权限:ohos.permission.INTERNET

controller控制器

可以控制web组件的各种行为,如前进、后退等操作

forward

按照历史栈,前进一个页面

backward

按照历史栈,后退一个页面

runJavaScript

异步执行javascript脚本,病通过回调方式返回脚本执行的结果

  • 在main/resource/rawfile目录下新建index.html页面
function test(){
 console.log(111)
}
  • web组件调用runJavaScript方法可以执行html中的javascript脚本
controller: WebController = new WebController();
Button().
	onclick(()=>{
		this.controller.runJavaScript({script: 'test()'})
})

支持的属性

属性
fileAccess
javaScriptAccess
imageAccess
zoomAccess
textZoomAtio
....
  • fileAccess
    fileAccess(boolean): 设置是否开启通过$rawfile(‘filepath/filename’)访问应用中的rawfile路径的文件。默认时启用

  • javaScriptAccess
    javaScriptAccess(boolean): 设置是否运行执行javascript脚本

  • imageAccess
    imageAccess(boolean): 设置是否允许自动加载图片资源

  • zoomAccess
    zoomAccess(boolean): 用于设置是否支持手势进行缩放,默认允许执行缩放;但是这个要求,网页自身支持缩放,这个属性才会生效。

  • textZoomAtio
    textZoomAtio(number): 用于设置页面的文本缩放百分比,默认值为100,表示100%。

支持方法

  • onConfirm
  • onAlert
  • onBeforeUnload
  • onConsole

文章来源:https://blog.csdn.net/weixin_46282323/article/details/134872541
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。