鸿蒙开发组件之Web

一、加载一个url

myWebController: WebviewController = new webview.WebviewController

  build() {
      Column() {
        Web({
          src: 'https://www.baidu.com',
          controller: this.myWebController
        })
      }
      .width('100%')
      .height('100%')
  }

二、注意点

2.1 不能用Previewer预览

Web这个组件不能使用预览，只能使用模拟器或者真机查看。

2.2 需要网络权限

需要在module.json5配置网络权限

 "requestPermissions": [
      {
        "name" : "ohos.permission.INTERNET",
//注意这里有个系统bug，不能写reason
//        'reason': 'abc',
        "usedScene" : {
          "when" : "inuse"
        },
      }
    ],

2.3 加载的不是当前页面

默认加载的是Index页面，我们需要在EntryAbility.ts的onWindowStageCreate方法中，设置加载咱们的Web的page。

onWindowStageCreate(windowStage: window.WindowStage) {
    // Main window is created, set main page for this ability
    hilog.info(0x0000, 'testTag', '%{public}s', 'Ability onWindowStageCreate');
    //加载咱们的WebPage页面
    windowStage.loadContent('pages/WebPage', (err, data) => {
      if (err.code) {
        hilog.error(0x0000, 'testTag', 'Failed to load the content. Cause: %{public}s', JSON.stringify(err) ?? '');
        return;
      }
      hilog.info(0x0000, 'testTag', 'Succeeded in loading the content. Data: %{public}s', JSON.stringify(data) ?? '');
    });
  }