harmony 鸿蒙应用侧调用前端页面函数

  • 2023-06-24
  • 浏览 (767)

应用侧调用前端页面函数

应用侧可以通过runJavaScript()方法调用前端页面的JavaScript相关函数。

在下面的示例中,点击应用侧的“runJavaScript”按钮时,来触发前端页面的htmlTest()方法。

  • 前端页面代码。
  <!-- index.html -->
  <!DOCTYPE html>
  <html>
  <body>
  <script>
      function htmlTest() {
          console.info('JavaScript Hello World! ');
      }
  </script>
  </body>
  </html>
  • 应用侧代码。
  // xxx.ets
  import web_webview from '@ohos.web.webview';
  
  @Entry
  @Component
  struct WebComponent {
    webviewController: web_webview.WebviewController = new web_webview.WebviewController();
  
    build() {
      Column() {
        Web({ src: $rawfile('index.html'), controller: this.webviewController})
        Button('runJavaScript')
          .onClick(() => {
             this.webviewController.runJavaScript('htmlTest()');
          })
      }
    }
  }

相关实例

针对Web组件开发,有以下相关实例可供参考:

你可能感兴趣的鸿蒙文章

harmony 鸿蒙Web

harmony 鸿蒙建立应用侧与前端页面数据通道

harmony 鸿蒙Web组件概述

harmony 鸿蒙管理Cookie及数据存储

harmony 鸿蒙使用Devtools工具调试前端页面

harmony 鸿蒙上传文件

harmony 鸿蒙管理位置权限

harmony 鸿蒙前端页面调用应用侧函数

harmony 鸿蒙在新窗口中打开页面

harmony 鸿蒙使用Web组件加载页面

0  赞