50.HarmonyOS鸿蒙系统 App(ArkUI)web组件实现简易浏览器

本文主要是介绍50.HarmonyOS鸿蒙系统 App(ArkUI)web组件实现简易浏览器，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

50.HarmonyOS鸿蒙系统 App(ArkUI)web组件实现简易浏览器

配置网络访问权限：

 

跳转任务：

Button('转到').onClick(() => {try {// 点击按钮时，通过loadUrl，跳转到www.example1.comthis.webviewController.loadUrl(this.get_url);} catch (error) {console.error(`ErrorCode: ${error.code},  Message: ${error.message}`);}})

 前进代码：

Button('-->>').onClick(()=>{if (this.webviewController.accessForward()){this.webviewController.forward();return true;}})

后退代码：

 Button('<<--').onClick(()=>{if (this.webviewController.accessBackward()){this.webviewController.backward();return true;}})

项目代码：

// xxx.ets
import web_webview from '@ohos.web.webview';@Entry
@Componentstruct WebComponent {webviewController: web_webview.WebviewController = new web_webview.WebviewController();@State get_url:string = "www.cnblogs.com/"@State cnblogs:string = 'www.cnblogs.com/'@State csdn:string = 'txwtech.blog.csdn.net'@State baidu:string = 'www.baidu.com'controller: TextInputController = new TextInputController()build() {Column() {Text('简易浏览器demo').backgroundColor(Color.Blue).fontColor(Color.White).fontSize(28)Row(){Text('地址：')TextInput({text: this.get_url, placeholder: '请输入网址...', controller: this.controller}).onChange((value:string)=>{this.get_url = value}).backgroundColor(Color.Gray)}Row(){Button("cnblogs").onClick(()=>{this.get_url = this.cnblogs})Button('csdn').onClick(()=>{this.get_url = this.csdn})Button('baidu').onClick(()=>{this.get_url = this.baidu})}Row(){Button('<<--').onClick(()=>{if (this.webviewController.accessBackward()){this.webviewController.backward();return true;}})Button('  ')Button('  ')Button('转到').onClick(() => {try {// 点击按钮时，通过loadUrl，跳转到www.example1.comthis.webviewController.loadUrl(this.get_url);} catch (error) {console.error(`ErrorCode: ${error.code},  Message: ${error.message}`);}})Button('  ')Button('  ')Button('-->>').onClick(()=>{if (this.webviewController.accessForward()){this.webviewController.forward();return true;}})}.borderColor(Color.Orange).backgroundColor(Color.Grey)// 组件创建时，加载www.example.comWeb({ src: '', controller: this.webviewController})}}
}

这篇关于50.HarmonyOS鸿蒙系统 App(ArkUI)web组件实现简易浏览器的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---