Arkts web组件的使用

访问在线网页时您需要在module.json5文件中申明网络访问权限:ohos.permission.INTERNET。

加载网页效果无法在预览器中查看,需要在模拟器或者真机中展示项目

Web组件的使用非常简单,只需要ArkTS文件中创建一个Web组件,传入两个参数就可以了。其中src指定引用的网页路径,controller为组件的控制器,通过controller绑定Web组件,用于实现对Web组件的控制

TypeScript 复制代码
// 使用web组件加载网页
import webview from '@ohos.web.webview'
@Entry
@Component
struct WebComp {
  controll:WebviewController = new webview.WebviewController()
  build() {
    Row() {
      Column() {
        Web({
          src:'https://www.bilibili.com/video/BV16X4y1g7wT/?spm_id_from=333.934.0.0',
          controller:this.controll
        })
      }
      .width('100%')
    }
    .height('100%')
  }
}

详细使用见官网

Web-ArkTS API参考-HarmonyOS应用开发

相关推荐
han_1 小时前
从一道前端面试题,谈 JS 对象存储特点和运算符执行顺序
前端·javascript·面试
aPurpleBerry1 小时前
React 01 目录结构、tsx 语法
前端·react.js
jayaccc1 小时前
微前端架构实战全解析
前端·架构
qingyun9891 小时前
Web Components 实战:创建自定义比例条组件
前端
前端小超超1 小时前
ionic + vue3 + capacitor遇到backButton问题
前端·javascript·vue.js
GIS之路1 小时前
GDAL 空间关系解析
前端
布列瑟农的星空2 小时前
WebAssembly入门(一)——Emscripten
前端·后端
贵州数擎科技有限公司2 小时前
一批优质 AI 域名转让(.ai)|适合 AI 创业 / 产品 / 公司品牌
前端
小二·2 小时前
微前端架构完全指南:qiankun 与 Module Federation 双方案深度对比(Vue 3 + TypeScript)
前端·架构·typescript
EndingCoder2 小时前
枚举类型:常量集合的优雅管理
前端·javascript·typescript