鸿蒙原生应用元服务开发-Web加载本地页面

最新推荐文章于 2024-05-18 11:09:56 发布

李洋-蛟龙腾飞公司

最新推荐文章于 2024-05-18 11:09:56 发布

阅读量284

点赞数 3

分类专栏： HarmonyOS/OpenHarmony开发学习分享文章标签：前端华为 HarmonyOS

本文链接：https://blog.csdn.net/weixin_69135651/article/details/138349986

版权

HarmonyOS/OpenHarmony开发学习分享专栏收录该内容

405 篇文章 21 订阅

订阅专栏

将本地页面文件放在应用的rawfile目录下，开发者可以在Web组件创建的时候指定默认加载的本地页面，并且加载完成后可通过调用loadUrl()接口变更当前Web组件的页面。

在下面的示例中展示加载本地页面文件的方法：

将资源文件放置在应用的resources/rawfile目录下。
图1 资源文件路径

鸿蒙原生应用元服务开发-Web加载本地页面-鸿蒙开发者社区

应用侧代码

// xxx.ets
import web_webview from '@ohos.web.webview';

@Entry
@Component
struct WebComponent {
  webviewController: web_webview.WebviewController = new web_webview.WebviewController();

  build() {
    Column() {
      Button('loadUrl')
        .onClick(() => {
          try {
            // 点击按钮时，通过loadUrl，跳转到local1.html
            this.webviewController.loadUrl($rawfile("local1.html"));
          } catch (error) {
            console.error(`ErrorCode: ${error.code},  Message: ${error.message}`);
          }
        })
      // 组件创建时，通过$rawfile加载本地文件local.html
      Web({ src: $rawfile("local.html"), controller: this.webviewController })
    }
  }
}
local.html页面代码。
<!-- local.html -->
<!DOCTYPE html>
<html>
  <body>
    <p>Hello World</p>
  </body>
</html>

本文参考引用HarmonyOS官方开发文档，基于API9。

李洋-蛟龙腾飞公司

关注

3
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
鸿蒙原生应用元服务开发-Web加载本地页面

将本地页面文件放在应用的rawfile目录下，开发者可以在Web组件创建的时候指定默认加载的本地页面，并且加载完成后可通过调用loadUrl()接口变更当前Web组件的页面。将资源文件放置在应用的resources/rawfile目录下。本文参考引用HarmonyOS官方开发文档，基于API9。
复制链接

扫一扫