HarmonyOS 鸿蒙Next:Promise中对状态变量修改,在子组件中没有渲染

发布于 1周前 作者 sinazl 来自 鸿蒙OS

HarmonyOS 鸿蒙Next:Promise中对状态变量修改,在子组件中没有渲染

import { MessageStore } from ‘./MessageStore’

@Entry
@Component
struct Parent {
@State message: string = ‘Hello World’
  aboutToAppear() {
//返回Promise结果
new MessageStore().getMessageList().then(res=>{
this.message = “你好!”
})
}
build() {
Column() {
Text(this.message).fontSize(20)
Divider()
Child ({ message: this.message })
}.width(‘100%’)
.height(‘100%’)
}
}

@Component
struct Child{
message: string =""

build() {
Column() {
Text(this.message)
}
.backgroundColor(Color.Red)
.height(100)
.width(‘100%’)
}
}

为什么Child子组件中message显示的是hello world,而不是“你好”,在渲染子组件的时候父组件的aboutToAppear方法不是应该已经执行结束了吗?

cke_6082.png

4 回复

aboutToAppear()里执行的是一个异步操作,因此不会等待其then()返回时对this.message的修改,会继续进入build()中渲染UI,此时message还是Hello World,传递给Child,而且接收方非状态变量,后面then的修改不会同步过去;

想同步将Child中变量改为 [@Link](/user/Link) message: string = ""; 即可同步。

楼主您好,UI同步这个需要进行状态管理的,建议参考下如下文档。

状态管理概述-状态管理-学习ArkTS语言-基础入门 | 华为开发者联盟 (huawei.com)

你子组件message啥状态变量控制也没给,当然不行啊。父子组件状态管理有很多种方式:
1. [@State](/user/State)和[@Prop](/user/Prop)
2.[@State](/user/State)和[@Link](/user/Link)
....

在HarmonyOS鸿蒙Next开发框架中,如果在Promise中对状态变量进行修改,但发现这些修改在子组件中没有正确渲染,这通常与状态更新和组件重新渲染的机制有关。

首先,确保你在Promise的.then().catch()回调中正确使用了this.setState()方法来更新状态变量。这是鸿蒙开发框架中推荐的方式来触发组件的重新渲染。

其次,检查子组件是否正确订阅了父组件传递的状态变量。如果状态是通过props传递的,确保子组件在render()方法或相应的JSX表达式中使用了这些props。

此外,确认没有任何异步逻辑或条件渲染逻辑阻止了子组件的更新。例如,如果子组件的渲染依赖于某个未满足的条件,那么即使状态更新了,子组件也可能不会重新渲染。

最后,如果使用了任何状态管理库(如Redux或MobX等),确保状态更新是通过库提供的方法进行的,并且这些更新被正确地触发和传递到了子组件。

如果问题依旧没法解决请联系官网客服,官网地址是:https://www.itying.com/category-93-b0.html

回到顶部