自定义 class 需要访问 WebComponent 中的 webViewController。

// 自定义类WebViewBridge： 
import web_webview from '@ohos.web.webview'; 
 
export default class WebViewBridge { 
  webViewController: web_webview.WebviewController; 
 
  // 是否已经执行完了onFirstScript方法,默认未执行 
 
  constructor(webviewController: web_webview.WebviewController) { 
    this.webViewController = webviewController; 
  } 
 
  public invoke(){ 
    console.log('-----', !this) 
    this.webViewController.runJavaScript(""); 
  } 
} 
 
// webview组件类： 
import web_webview from '@ohos.web.webview'; 
import WebViewBridge from './WebViewBridge'; 
 
@Entry 
@Component 
struct WebComponent { 
  webviewController: web_webview.WebviewController = new web_webview.WebviewController(); 
  webViewBridge: WebViewBridge = new WebViewBridge(this.webviewController); 
 
  aboutToAppear(){ 
    web_webview.WebviewController.setWebDebuggingAccess(true); 
  } 
  build() { 
    Column() { 
      // 组件创建时，通过$rawfile加载本地文件local.html 
      Web({ src: $rawfile('template.html'), controller: this.webviewController }) 
        .javaScriptAccess(true) 
        .javaScriptProxy({object: this.webViewBridge, name: 'NativeBridge', 
          methodList: [ 
          'invoke', 
          ], controller: this.webviewController}, 
        ) 
        .onPageBegin(() => { 
          this.webviewController.setCustomUserAgent('Android OpenHarmony') 
          console.log('------>onPageBegin') 
        }) 
    } 
  } 
}
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.
48.