HarmonyOS 鸿蒙Next中@State url赋值后,web不加载
HarmonyOS 鸿蒙Next中@State url赋值后,web不加载 通过web加载H5页面,H5的url不同的方式获取,web的加载不一样。两种方式会自动加载,两种方式不会加载。直接赋值,或者取前面页面传过来的参数都可以自动加载。但是通过方法获取再赋值后,web不加载。这个是什么原因?
代码如下
@Component
export struct Portal {
private context = getContext(this) as common.UIAbilityContext;
webViewController: webview.WebviewController = new webview.WebviewController();
[@State](/user/State) url: string = '';
private backPressedTime: number = 0
[@State](/user/State) webViewBridge: WebViewBridge = new WebViewBridge(this.webviewController)
[@State](/user/State) showProgressDialog: boolean = false
aboutToAppear():void {
// 检查隐私政策更新状态
Logger.debug('Portal => about to appear')
Logger.debug('Portal => param is : ', '' + Router.getRouter(RouterConstants.ENTRY_ROUTER_NAME)
.getParamByName('Portal'))
// 这样写wew不会自动加载
OfflineModuleManage
.queryModuleUrl(OfflineModuleConstants.OFFLINE_MODULE_HOMEPAGE_MODULE_ID,'/mypage/homepage')
.then((data:string) => {
Logger.debug('Portal => queryModuleUrl data is : ' + data)
this.url = 'xxxxxx/homepage'
Logger.debug('Portal => queryModuleUrl data is : ' + data)
})
.catch((err:BusinessError) => {
Logger.error(`Portal => queryModuleUrl异常,code is : ${err.code}`, `message is : ${err.message}`)
})
// 定义一个eventId为1的事件
let event: emitter.InnerEvent = {
eventId: WebConstants.SHOW_PROGRESS_DIALOG_NOTIFICATION_EVENT_ID
}
// 收到eventId为1的事件后执行该回调
let callback = (eventData: emitter.EventData): void => {
Logger.info('event callback:' + JSON.stringify(eventData));
this.showProgressDialog = eventData.data?.isShow
}
// 订阅eventId为1的事件
emitter.on(event, callback)
Logger.debug('路由全路径:' + JSON.stringify(Router.getRouter(RouterConstants.ENTRY_ROUTER_NAME)
.getAllPathName()))
Logger.debug('自己记录的路由全路径:' + JSON.stringify(Router.getRouterTrack(RouterConstants.ENTRY_ROUTER_NAME)))
}
build() {
NavDestination() {
Stack({ alignContent: Alignment.Center }) {
Web({
src: this.url,
controller: this.webviewController
})
.javaScriptAccess(true)
.onControllerAttached(() => {
Logger.debug('WebBuilder => onControllerAttached')
WebUtil.registerJavaScriptProxy(this.webviewController)
})
.onPageBegin((event) => {
Logger.debug('WebBuilder => onPageBegin')
})
.onInterceptRequest((event) => {
Logger.debug('WebBuilder => onInterceptRequest : ', '' + event?.request.getRequestUrl())
return null
})
.onPageEnd((event) => {
Logger.debug('WebBuilder => onPageEnd')
})
.onErrorReceive((event) => {
Logger.debug('WebBuilder => onErrorReceive is : url is : ' + event?.request.getRequestUrl() + ';method is : ' + event?.request.getRequestMethod() + ';header is : ' + event?.request.getRequestHeader())
Logger.debug('WebBuilder => onErrorReceive code is : ' + event?.error.getErrorCode() + ', info is : ' + event?.error.getErrorInfo())
})
.domStorageAccess(true)
.width('100%')
.height('100%')
if (this.showProgressDialog) {
LoadingLayout()
}
}
}
.hideTitleBar(true)
.onBackPressed(() => {
if (systemDateTime.getTime(false) - this.backPressedTime > 2000) {
promptAction
.showToast({
message: '再按一次退出程序',
duration: 2000
})
this.backPressedTime = systemDateTime.getTime(false)
} else {
this.context?.terminateSelf()
}
return true
})
.onShown(() => {
Logger.debug('路由全路径:' + JSON.stringify(Router.getRouter(RouterConstants.ENTRY_ROUTER_NAME)
.getAllPathName()))
Logger.debug('自己记录的路由全路径:' + JSON.stringify(Router.getRouterTrack(RouterConstants.ENTRY_ROUTER_NAME)))
})
}
}
更多关于HarmonyOS 鸿蒙Next中@State url赋值后,web不加载的实战教程也可以访问 https://www.itying.com/category-93-b0.html
可以通过webviewController.loadUrl()解决。
更多关于HarmonyOS 鸿蒙Next中@State url赋值后,web不加载的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html
在HarmonyOS鸿蒙Next中,使用[@State](/user/State)
装饰器声明的url
变量赋值后,如果Web组件未加载内容,可能是由于以下原因:
-
状态更新未触发UI刷新:
[@State](/user/State)
装饰的变量在赋值后会自动触发UI刷新,但如果赋值操作未正确触发状态更新,Web组件可能不会重新加载。确保赋值操作是在UI线程中执行的。 -
Web组件未正确绑定
url
:检查Web组件的src
属性是否与[@State](/user/State)
装饰的url
变量正确绑定。例如:[@State](/user/State) url: string = 'https://example.com'; build() { Web({ src: this.url }) }
-
url
赋值时机问题:如果url
在组件初始化后才被赋值,可能需要手动调用this.update()
来触发UI刷新。 -
网络或URL问题:确保
url
是有效的网络地址,且设备网络连接正常。无效的URL或网络问题会导致Web组件无法加载内容。 -
Web组件生命周期问题:Web组件可能未在
url
赋值后正确加载内容。检查Web组件的生命周期方法,确保其在url
更新后重新加载。 -
鸿蒙Next版本兼容性:某些鸿蒙Next版本可能存在Web组件加载的兼容性问题,确保使用的是最新版本的鸿蒙Next。
-
权限问题:确保应用已获取必要的网络权限,如
ohos.permission.INTERNET
。
如果以上问题均已排查且问题依旧存在,建议检查鸿蒙Next的官方文档或更新日志,确认是否存在已知问题或修复补丁。
在HarmonyOS鸿蒙Next中,@State
用于声明状态变量,当url
赋值后,Web组件没有加载可能有以下几个原因:
- URL格式错误:确保
url
是有效的URL格式,如http://
或https://
开头。 - Web组件未正确使用:确保使用了
Web
组件,并且src
属性绑定到了url
状态变量。 - 状态更新未触发:确保
url
的更新触发了UI的重新渲染。 - 网络权限:检查是否在
config.json
中声明了网络权限。
示例代码:
@State url: string = 'https://example.com';
build() {
Web({ src: this.url })
}
检查上述问题,确保Web组件正确加载。